记录一下应用场景:当添加的内容属于暂存数据时,再次选择时需要把已添加的数据设置为不可选,避免上传时数据重复

文章目录

HTML

在selection组件中添加:selectable属性

<el-table-column :selectable="checkSelectMember" 
				 type="selection" width="55" align="center"/>

方法区

在方法中做数据对比,若外部数据与本行数据相同时,设置isChecked = false不可选,否则就返回true可选
这里的memberList指外部暂存数据集合,row指每一行可添加数据

	  /**
       * 设置多选框已有人员不可选
       * row:当前行数据
       * index:当前第几位
       */
      checkSelectMember(row, index) {
        let isChecked = true
        this.memberList.forEach(member => {
          if (member.employeeName === row.nickName) {
            isChecked = false
          }
        })
        return isChecked
      },

效果图

第一次添加完数据:

在这里插入图片描述
在这里插入图片描述

再次点添加时已有数据不可选:

在这里插入图片描述
记录就到这里,有不清楚的欢迎到评论区留言~

Logo

前往低代码交流专区

更多推荐