Bootstrap

ant design vue table表格组件customRow用法

ant design vue table表格组件customRow用法

话不多说上示例:

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

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

js代码:

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

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

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

官方用法示例解读:

<Table
  customRow={(record) => {
    return {
      props: {
        xxx... //属性
      },
      on: { // 事件
        cli
;