VUE+Elementui实现复选框的多选与全选

 

 

 

   getSchemeDetail() {
      this.$api(
        'getRiskStrategyBaseStrategyBaseData',
        this.riskStrategyType,
        'params',
      )
        .then((res) => {
          console.log(res)
          // this.programList = res.result;
          this.tableData = res.result

          if (this.riskStrategyType == 2) {
            this.checkList = res.result
          }

          let checkList = JSON.parse(JSON.stringify(this.checkList))
          checkList.forEach((item) => {
            if (item.children && item.children.length > 0) {
              let selectDataList = []
              item.children.forEach((evt) => {
                if (Number(evt.selected === 1)) {
                  selectDataList.push(evt.name)
                }
              })
              this.checkedCities = selectDataList
              item.checkAll = selectDataList.length === item.children.length
              if (item.checkAll) {
                item.selected = '1'
              }
            }
          })
          this.checkList = checkList
        })
        .catch((err) => {
          this.$message.error(err)
        })
    },

    // 全选
    handleCheckAllChange(checked, item) {
      if (checked) {
        if (item.children && item.children.length > 0) {
          let childrenDataList = JSON.parse(JSON.stringify(item.children))
          let optionsData = []
          childrenDataList.forEach((i) => {
            i.selected = '1'
            optionsData.push(i.name)
          })
          let arr = this.checkedCities.concat(optionsData)
          this.checkedCities = Array.from(new Set(arr))
          item.selected = '1'
        }
      } else {
        let childrenData = JSON.parse(JSON.stringify(item.children))
        let deleteIdList = []
        childrenData.forEach((i) => {
          deleteIdList.push(i.name)
        })
        let arr = this.checkedCities.filter(
          (items) => !deleteIdList.some((i) => i == items),
        )
        item.selected = '0'
        this.checkedCities = arr
      }
    },

    // 多选
    handleCheckedCitiesChange(value, item) {
      let checkedCount = item.children.length
      let childrenData = JSON.parse(JSON.stringify(item.children))
      let deleteIdList = []
      childrenData.forEach((i) => {
        deleteIdList.push(i.name)
      })
      let date = this.checkedCities.filter((i) => deleteIdList.indexOf(i) > -1)
      item.checkAll = checkedCount === date.length
    },