欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

表格单元格点击事件

程序员文章站 2022-06-08 15:41:22
...
            <el-table
                      //单元格点击事件
              @cell-click="weituocanhuil"
                      //更改样式
              :cell-style="cellStyle"
              v-if="flag"
              ref="dragTable2"
              :data="memberData"
              row-key="id"
              border
              :header-cell-style="{ background: '#F3F6FB' }"
              :row-class-name="tableRowClassName"
            >
             <el-table-column
                id="other"
                              //绑定点击事件,决定点击哪个单元格
                prop="feedbackStatusValue"
                label="参会方式"
                v-if="num == 1"
                :class-name="sort2 ? 'allowdrog' : 'allowdrog3'"
              >
    weituocanhuil(row, column, cell, event) {
        //绑定点击事件,决定点击哪个单元格
      if (column.property == "feedbackStatusValue") {
        this.weituodialogVisible = true;
        this.canhuiren = row.memberName;
        this.weituoSubmit.memberId = row.memberId;
        this.weituoSubmit.feedbackStatusValue = row.feedbackStatusValue;
        this.weituoSubmit.feedbackStatusCode = row.feedbackStatusCode;
        this.weituoSubmit.entrustId = row.entrustId;
        this.memberData2 = [];
        if (this.memberData && this.memberData.length) {
          this.memberData.forEach((item) => {
            if (item.memberId != row.memberId) {
              this.memberData2.push(item);
            }
          });
        }
        if (this.memberData2 && this.memberData2.length) {
          this.memberData2.forEach((item, index) => {
            if (item.memberId != row.entrustId) {
              this.weituoSubmit.entrustId = row.entrustName;
            }
          });
        } else {
          this.weituoSubmit.entrustId = row.entrustName;
        }
      }
    },

比较特殊的是,样式需要在js里面更改

如下:

cellStyle({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 5) {
        return "color:#4d84fe;cursor: pointer";
      }
    },