vue关于多个下拉框调用同一个数组时,下拉框的值不能重复

时间:2024-03-14 07:41:30

五个下拉框,每个下拉框选中的值不能重复,选过的下拉值会置灰,代码如下

vue关于多个下拉框调用同一个数组时,下拉框的值不能重复

五个下拉框必选,数据结构如下

vue关于多个下拉框调用同一个数组时,下拉框的值不能重复

vue关于多个下拉框调用同一个数组时,下拉框的值不能重复

重点是计算与监听相关的属性

vue关于多个下拉框调用同一个数组时,下拉框的值不能重复

下面是封装的方法

//  此为多个下拉框调用同一个数组时,不能选同一个id的值,如果是id则dbSourceId改为'id',dataArray为当前下拉框的数组
export function getdiabledSelect (val, oldVal, dbSourceId, dataArray) {
  dataArray = dataArray.filter((value,key,arr) => {
    if(value[dbSourceId] === oldVal) {
      value.disabled = false
    }else if(value[dbSourceId] === val) {
      value.disabled = true
    }
    return value
  })  
}