ant design vue table表格组件 customRow 用法

html代码：customRow 绑定一个 click 方法，名字自己可以随便起：

<a-table
  :columns="clumns"
  :data-source="data"
  :customRow='click'>

js 代码：

methods: {
  click(record, index) {
    return {
      on: {
        dbclick: () => {
          console.log(record)
        }
      }
    }
  }
}

在 js 中的methods中创建方法 click(record,index)。record 与 index 分别是该行的数据（可以获取到放在 data-source 中的所有属性，即使没有在表格中呈现出来的也可以获取到）和该行数据在表格中的下标。

       通过上面的写法，可以在双击表格某一行的时候，打印出这一行所绑定的 data的全部内容。

官方用法示例解读：

<Table
  customRow={(record) => {
    return {
      props: {
        xxx...  //属性
      },
      on: {  //事件
       click: (event) => {},  //点击行
       dbclick: (event) => {},
       contextmenu: (event) => {},  //鼠标移入行
       mouseleave: (event) => {}
      }
    }
  }}
  customHeaderRow={(column) => {
    return {
      on: {
        click: () => {},  //点击表头行
      }
    }
  }}
/>

官方用法是 customRow 属性绑定了一个对象，同时这个对象也可以获取到 record 中的内容。这个对象拥有 props 属性（非必传参）和 on 属性。props 中可以用来放在父组件传入的参数，on 里面则是绑定了单击、双击一些事件，这里面的 click、dbclick则是固定名称，写入的方法就是单击双击实现的效果。