element 表格如何实时修改按钮

效果图

思路：1、通过判断当前行的某个字段 决定是开启还是关闭我这里是enabled

	v-if="!scope.row.enabled"

2、通过`点击事件对原有数据的当前行进行修改`通过`isOpen(scope.$index, scope.row)`
第一个参数是获得`当前行所在的索引`，第二个参数是`获得当前行的所有字段`

 this.tableData[index].enabled = !item.enabled;

html:

<el-table :data="tableData" border style="width: 100%">
       <el-table-column label="操作">
            <template slot-scope="scope">
              <div style="display: flex;">
                <div
                  v-if="!scope.row.enabled"
                  style="color: rgba(157, 4, 4, 100);cursor:pointer;margin-right: 5px;"
                  @click="isOpen(scope.$index, scope.row)"
                >
                  暂停供货
                </div>
                <div
                  v-else
                  @click="isOpen(scope.$index, scope.row)"
                  style="color: rgba(157, 4, 4, 100);cursor:pointer;margin-right: 5px;"
                >
                  开启供货
                </div>
              </div>
            </template>
          </el-table-column>
</el-table> 
      

js

    // 是否开启
    isOpen(index, item) {
      var id = [];
      id.push(item.id);
      // 发送的修改请求
      couponEnabled({
        targetIds: id,
        token: getToken(),
        yes: !item.enabled
      })
        .then(res => {
          console.log(res, "是否开启");
          if (res.status === 200) {
           // 关键
            this.tableData[index].enabled = !item.enabled;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    // 下载