1. 程式人生 > >Element-ui Cascader 級聯選擇器 同時返回 value 和 label

Element-ui Cascader 級聯選擇器 同時返回 value 和 label

element part cascade sele color span get model dep

cascader 組件賦值一個別名

<el-form-item label="部門" prop="departmentId">
        <el-cascader
          ref="cascaderAddr"
          :options="departmentData"
          change-on-select
          v-model="departmentIds"
          :props="defaultProps"
          @change="getDepartmentId"
          clearable
        
> </el-cascader> </el-form-item>

然後我們就可以通過 currentLabels 來獲取 cascader 組件中的 label

// 選擇部門
    getDepartmentId(currentVal) {
      if (currentVal.length == 0) {
        this.conditionForm.departmentId = ‘‘;
      } else {
        console.log(currentVal,this.departmentIds);
        // this.departmentId = currentVal[currentVal.length-1];
        this.conditionForm.departmentId = currentVal.join(‘,‘);
        this.conditionForm.departmentName = this.$refs[‘cascaderAddr‘].currentLabels.join(‘,‘);
      }
    },

Element-ui Cascader 級聯選擇器 同時返回 value 和 label