el-cascader 使用

//前端代碼
<el-cascader
    v-model="mtclassList"
     :options="materielCategoryVOs"
     placeholder="請選擇"
     change-on-select
     clearable
     :show-all-levels="false">
 </el-cascader>
 // 如果後端返回的是 用","分隔開的id 如 "123456,654221" 就進行分割賦值就可以回顯        
this.mtclassList = this.form.mtclassIds != null && this.form.mtclassIds.length > 0 ? this.form.mtclassIds.trim().split(",") : [this.form.mtclassId];

// 初始化賦值事件
selectTypeList: function () {
		//this.$_Axios 這個是封裝的請求方法
        this.$_Axios('method', 'url', params, (status, result, errMsg) => {
          if (status) {
            //初始化採購分類
            if (result.materielCategoryVOs != null) {
              let classList = [];
              // materielCategoryVOs 是後臺處理過後的返回數據 處理完的數據類型就是聯級下拉框
              // 將處理過的List數據拼接起來給聯級下拉框即可
              result.materielCategoryVOs.forEach((item,index)=>{
                classList.push({"children": item.children ,"value": item.value, "label": item.label})
              })
              //materielCategoryVOs 聯級下拉框
              this.materielCategoryVOs = classList

            }
          }
        })
      }

記錄問題方便使用

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章