<a-table rowKey="id"
:dataSource="bookDataSource"
:columns="columns"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,columnTitle: columnTitle}"
:pagination="false">
<template slot="operation"
slot-scope="text, record">
<a-popconfirm v-if="bookDataSource.length"
title="确定删除该记录吗?"
@confirm="() => onDelete(record.id)">
<a href="javascript:;">移除</a>
</a-popconfirm>
</template>
</a-table>
data () {
return {
columnTitle: '是否必选',
selectedRowKeys: [],
bookDataSource: [],
columns: [
{
title: '商品名称',
width: '30%',
align: "center",
dataIndex: 'bookName',
},
{
title: '商品图片',
align: "center",
width: '30%',
dataIndex: 'bookImg',
customRender: (text, row, index) => {
return <img src={text} style={{ width: '50px', height: '50px', borderRadius: '1–0%' }}></img>;
}
},
{
title: '价格',
align: "center",
width: '15%',
dataIndex: 'listPrice',
},
{
title: '操作',
dataIndex: 'operation',
align: "center",
width: '12%',
scopedSlots: { customRender: 'operation' },
}],
}
在columns中进行进一步处理