github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: support staticClass and dynamic class #371

pull/377/head
tangjinzhou 2019-01-06 21:14:14 +08:00
parent ba4992b412
commit b87d722143
3 changed files with 28 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/_util/props-util.js
View File

@ -180,14 +180,16 @@ export function getClass (ele) {
} else if (ele.$vnode && ele.$vnode.data) { } else if (ele.$vnode && ele.$vnode.data) {
data = ele.$vnode.data data = ele.$vnode.data
} }
const tempCls = data.class || data.staticClass const tempCls = data.class || {}
const staticClass = data.staticClass
let cls = {} let cls = {}
staticClass && staticClass.split(' ').forEach(c => { cls[c.trim()] = true })
if (typeof tempCls === 'string') { if (typeof tempCls === 'string') {
tempCls.split(' ').forEach(c => { cls[c.trim()] = true }) tempCls.split(' ').forEach(c => { cls[c.trim()] = true })
} else if (Array.isArray(tempCls)) { } else if (Array.isArray(tempCls)) {
classNames(tempCls).split(' ').forEach(c => { cls[c.trim()] = true }) classNames(tempCls).split(' ').forEach(c => { cls[c.trim()] = true })
} else { } else {
cls = tempCls cls = { ...cls, ...tempCls }
} }
return cls return cls
} }

12
components/table/__tests__/__snapshots__/Table.test.js.snap
View File

@ -1,16 +1,16 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Table renders JSX correctly 1`] = ` exports[`Table renders JSX correctly 1`] = `
<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default"><div class="ant-table-content"><!----><div class="ant-table-body"><table class=""><colgroup><col><col><col></colgroup><thead class="ant-table-thead"><tr><th key="0" colspan="2" class=""><div>Name</div></th><th key="age" rowspan="2" class=""><div>Age</div></th></tr><tr><th key="firstName" class=""><div>First Name</div></th><th key="lastName" class=""><div>Last Name</div></th></tr></thead><tbody class="ant-table-tbody"><tr class="ant-table-row ant-table-row-level-0" data-row-key="1"><td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span> <div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default"><div class="ant-table-content"><!----><div class="ant-table-body"><table class=""><colgroup><col><col><col></colgroup><thead class="ant-table-thead"><tr><th key="0" colspan="2" class=""><div>Name</div></th><th key="age" rowspan="2" class=""><div>Age</div></th></tr><tr><th key="firstName" class=""><div>First Name</div></th><th key="lastName" class=""><div>Last Name</div></th></tr></thead><tbody class="ant-table-tbody"><tr class="ant-table-row ant-table-row-level-0" data-row-key="1"><td class=""><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->John</td> <!---->John</td>
<td>Brown</td> <td class="">Brown</td>
<td>32</td> <td class="">32</td>
</tr> </tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2"> <tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span> <td class=""><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jim</td> <!---->Jim</td>
<td>Green</td> <td class="">Green</td>
<td>42</td> <td class="">42</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>

36
components/table/__tests__/__snapshots__/demo.test.js.snap
View File

@ -2896,31 +2896,31 @@ exports[`renders ./components/table/demo/template.md correctly 1`] = `
</thead> </thead>
<tbody class="ant-table-tbody"> <tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1"> <tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span> <td class=""><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->John</td> <!---->John</td>
<td>Brown</td> <td class="">Brown</td>
<td>32</td> <td class="">32</td>
<td>New York No. 1 Lake Park</td> <td class="">New York No. 1 Lake Park</td>
<td><span><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">nice</div><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">developer</div></span></td> <td class=""><span><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">nice</div><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">developer</div></span></td>
<td><span><a href="javascript:;">Action 一 John</a> <div class="ant-divider ant-divider-vertical"></div> <a href="javascript:;">Delete</a></span></td> <td class=""><span><a href="javascript:;">Action 一 John</a> <div class="ant-divider ant-divider-vertical"></div> <a href="javascript:;">Delete</a></span></td>
</tr> </tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2"> <tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span> <td class=""><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jim</td> <!---->Jim</td>
<td>Green</td> <td class="">Green</td>
<td>42</td> <td class="">42</td>
<td>London No. 1 Lake Park</td> <td class="">London No. 1 Lake Park</td>
<td><span><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">loser</div></span></td> <td class=""><span><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">loser</div></span></td>
<td><span><a href="javascript:;">Action 一 Jim</a> <div class="ant-divider ant-divider-vertical"></div> <a href="javascript:;">Delete</a></span></td> <td class=""><span><a href="javascript:;">Action 一 Jim</a> <div class="ant-divider ant-divider-vertical"></div> <a href="javascript:;">Delete</a></span></td>
</tr> </tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3"> <tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span> <td class=""><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Joe</td> <!---->Joe</td>
<td>Black</td> <td class="">Black</td>
<td>32</td> <td class="">32</td>
<td>Sidney No. 1 Lake Park</td> <td class="">Sidney No. 1 Lake Park</td>
<td><span><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">cool</div><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">teacher</div></span></td> <td class=""><span><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">cool</div><div data-show="true" class="ant-tag ant-tag-blue ant-tag-zoom-enter">teacher</div></span></td>
<td><span><a href="javascript:;">Action 一 Joe</a> <div class="ant-divider ant-divider-vertical"></div> <a href="javascript:;">Delete</a></span></td> <td class=""><span><a href="javascript:;">Action 一 Joe</a> <div class="ant-divider ant-divider-vertical"></div> <a href="javascript:;">Delete</a></span></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>