Element-UI中关于table表格的那些骚操作(小结)

在每一个data中添加buttonVisible字段，使用v-if/v-else指令实现按钮的显示与隐藏

{
   date: '2016-05-10',
   name: '王大虎',
   address: '上海市普陀区金沙江路 1518 弄',
   zip: 200333,
   buttonVisible: true
  }

编写changeTable方法，点击按钮的时候更改buttonVisible的值

changeTable (buttonVisible, index) {
  this.tableData[index].buttonVisible = !buttonVisible
  }

给el-table添加row-style，并且将tableRowStyle方法传递给row-style

<el-table
   :data="tableData"
   class="table"
   border
   :row-style="tableRowStyle"
  >

编写tableRowStyle方法，根据每一行buttonVisible的值设置背景色

// 修改table tr行的背景色
  tableRowStyle ({ row, rowIndex }) {
  if (this.tableData[rowIndex].buttonVisible === false) {
   return 'background-color: rgba(243,243,243,1)'
  }
  }