单元格编辑功能，如何修改v-if绑定的条件，实现只有某几个字段可编辑。？

• Z时代
• 2024-02-16
• 分类：IT

<el-table
          :data="
            this.tableData.slice(
              (this.currentPage - 1) * this.pagesize,
              this.currentPage * this.pagesize
            )
          "
          border
          fit
          height="500px"
          highlight-current-row
          style="width: 100%"
          @cell-dblclick="cellDblclick"
          :row-class-name="tableRowClassName"
        >
          <el-table-column
            v-for="(item, i) in cols"
            :key="i"
            align="center"
            :prop="item.prop"
            :label="item.label"
          >
            <template slot-scope="{ row,column }">
              <el-input
                v-if="cellDoubleClice&&row.row_index===cellRowIndex&&column.label===cellLabel"
                v-model="row[item.prop]"
                ref="input"
              ></el-input>
              <span v-else>{{ row[item.prop] }}</span>
            </template>
          </el-table-column>
        </el-table>

cellDoubleClice: false,
      cellRowIndex: null,
      cellLabel:''

 // 遍历出所有表格行的回调函数
    tableRowClassName({ row, rowIndex }) {
      // 给row添加索引
      row.row_index = rowIndex;
    },
    // 双击事件触发的函数
    cellDblclick(row, column, cell, event) 
      this.cellDoubleClice = event.bubbles;
      // 用列字段名称作为列的唯一标识
      this.cellLabel=column.label
      // 获取点击单元格的行索引
      this.cellRowIndex = row.row_index;
    },

如何修改v-if绑定的条件，实现只有某几个字段可编辑。

回答：

多重判断条件，可以在与号后添加括号里面写或条件

以上是 单元格编辑功能，如何修改v-if绑定的条件，实现只有某几个字段可编辑。？ 的全部内容， 来源链接： utcz.com/p/935144.html