美文网首页
封装一个el-select 全选方法

封装一个el-select 全选方法

作者: 小白IT | 来源:发表于2020-11-24 16:24 被阅读0次

// 全选 

           val为组件绑定的值 

           term为绑定对象的key  

           optionsArr为下拉框数据 

           str为下拉框绑定的value值是id还是其他值

           (需要在el-form中绑定ref)

方法代码


    selectAll(val, term, optionsArr, str) {

      const allValues = []

      let checkArr = val

      for (const item of optionsArr) {

        allValues.push(item[str])

      }

    // oldSearchBankType为之前选择的值

      let oldVal = this.oldSearchBankType.length === 1 ? this.oldSearchBankType : []

      //  旧值无全选 新值有全选

      if (val.includes('全选') || (!this.oldSearchBankType.includes('全选') && val.includes('全选'))) {

        console.log(allValues)

        checkArr = allValues

        oldVal = checkArr

      }

      //  旧值有全选 新值无全选

      if (this.oldSearchBankType.includes('全选') && !val.includes('全选')) {

        checkArr = []

        oldVal = checkArr

      }

      // 都有全选

      if (this.oldSearchBankType.includes('全选') && val.includes('全选')) {

        if (val.length === 1) {

          checkArr = []

        } else {

          const index = val.indexOf('全选')

          val.splice(index, 1) // 排除全选选项

          checkArr = val

        }

        oldVal = checkArr

      }

      // 都没全选

      if (!this.oldSearchBankType.includes('全选') && !val.includes('全选')) {

        if (val.length === allValues.length - 1) {

          checkArr = ['全选'].concat(val)

          oldVal = checkArr

        }

      }

      this.$refs['refNoPassLook'].model[term] = checkArr

      this.oldSearchBankType = oldVal

    }

相关文章

网友评论

      本文标题:封装一个el-select 全选方法

      本文链接:https://www.haomeiwen.com/subject/eraiiktx.html