官方例子:Vxe Table v3.8
{
field: 'num1',
title: 'Num1',
showHeaderOverflow: true,
filters: [{ data: '' }],
editRender: { autofocus: '.my-input' },
slots: {
// 使用插槽模板渲染
default: 'num1_default',
header: 'num1_header',
footer: 'num1_footer',
filter: 'num1_filter',
edit: 'num1_edit'
}
},
{
field: 'address',
title: 'Address',
showOverflow: true,
slots: {
// 使用 JSX 渲染
default: ({ row }) => {
return [
<span style="color: blue" onClick={ () => this.addressClickEvent(row) }>自定义模板内容</span>
]
}
}
},
自定义的用法
for (var item of tabhead) {
if (item.children != undefined && item.children != null) {
for (var subItem of item.children) {
//xsje销售金额
if (subItem.field == 'xsje') {
this.configData[subItem.field]=subItem.routerpath;
subItem.slots = {
// 使用 JSX 渲染
default: ({ row , column }) => {
return [
<span style="color: blue;text-decoration:none;cursor:pointer;" onClick={() => {
var routerpath = this.configData[column.field];
this.$refs.detailDailog.open(routerpath);
}}>{row.xsje}</span>
]
}
}
}
}
}
}
this.tableColumns = tabhead