vue.js table组件插入图标
<a-form-item:labelCol="labelCol":wrapperCol="wrapperCol"label="盘点结果"><a-tablebordered:columns="columns1"size="small":dataSource="inventoryResults" :scroll="{ y...
·
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="盘点结果">
<a-table
bordered
:columns="columns1"
size="small"
:dataSource="inventoryResults" :scroll="{ y: 155 }">
<div slot="status" slot-scope="text, record">
<a-icon v-if="record.status == 1" type="exclamation-circle" style="color: red;" />
<a-icon v-else type="check-circle" style="color: green;"/>
</div>
</a-table>
</a-form-item>
使用插槽:scopedSlots: { customRender: ‘status’ }
export default {
name: "LookGoodsEditModal",
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
},
// 表头
columns1: [
{
title: '编码',
align:"center",
width: 155,
dataIndex: 'waresCode'
},
{
title: '名称',
align:"center",
width: 60,
dataIndex: 'waresName'
},
{
title: 'ID',
width: 90,
align:"center",
dataIndex: 'tagId'
},
{
title: '状态',
width: 60,
align:"center",
dataIndex: 'status',
scopedSlots: { customRender: 'status' },
}
]
}
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)