andv table customRender设置成slots时候表格利用customCell合并列

xujing_06

已于 2023-05-17 17:51:24 修改

阅读量256

点赞数

文章标签：前端 javascript html

于 2023-05-17 17:47:40 首次发布

本文链接：https://blog.csdn.net/xujing_06/article/details/130731428

版权

const mechanismColumns: [
    {
        title: '',
        key: 'id',
        dataIndex: 'id',
        width: '50px',
        align: 'center',
        customRender: function (column: any) {
            let str = column.index + 1 + '';
            str = str.padStart(2, '0');
            return str;
        },
    },
    {
        title: '机构名',
        key: 'mechanismName',
        dataIndex: 'mechanismName',
        width: '30%',
        slots: { customRender: 'mechanismName' },
        customCell: function (column: any) {
            if (column.isEdit) {
                return {
                    colspan: 2,  //编辑的时候合并
                };
            }
        },
    },
    {
        title: '机构层级',
        dataIndex: 'hierarchy',
        key: 'hierarchy',
        width: '35%',
        customCell: function (column: any) {
            if (column.isEdit) {
                return {
                    style: {
                        display: 'none', // 编辑的时候给合并之后的列隐藏
                    },
                };
            }
        },
    },
    {
        title: '包含下级',
        dataIndex: 'subsumption',
        key: 'subsumption',
        slots: { customRender: 'subsumption' },
        align: 'center',
        width: '20%',
    },
    {
        title: '',
        dataIndex: 'operate',
        key: 'operate',
        slots: { customRender: 'operate' },
        align: 'center',
        width: '15%',
    },
],