Ant-Design-Vue table 合并单元格,并且添加点击事件

52 阅读1分钟
<template>
  <a-table
    bordered
    :rowKey="(record, index) => index"
    :columns="columns"
    :dataSource="dataSource"
    :pagination="false"
  ></a-table>
</template>

<script>
export default {
  data() {
    let that = this
    return {
      columns:[
        {
          title: '区域',
          dataIndex: 'groundName',
          customRender: (text, row, index) => {
            var child = that.$createElement('a', {
              domProps: {
                innerHTML: text
              },
              on: {
                click: function() {
                  that.handleClick(row)
                }
              }
            })
            var obj = {
              children: child,
              attrs: {}
            }
            if (row.orgName === '合计') {
              obj.attrs.colSpan = 0
            }
            return obj
          }
        },
      ]
    };
  },
  methods: {
    handleClick(row) {
      console.log('row',row)
    },
  },
};
</script>