element 级联选择器 省市联动

官网的demo省略了数据,导致一直不正确

list_linkage存储一级数据

props中配置懒加载请求的数据

<el-cascader
 
  :options="list_linkage" @change="handleItemChange" :props="pp"></el-cascader>

 

mounted中对list_linkage请求赋值

getCityList(form){
  let _this=this
  let url=appConfig.GET_ALL_ADMIN_INFO
  axios.post(url,form).then( res => {
    let temp=[]
   res.data.DATA.map( v => {
     temp.push({
       label:v.NAME,
       value:v.ADMIN_CODE
     })
   })
    _this.list_linkage=temp
    _this.citySelPlace="请选择"
      _this.selCityAble=false

  }).catch( e => {
    _this.$message({
      type:"error",
      message:e
    })
  })
},

props中的配置

pp:{
  lazy: true,
  lazyLoad (node, resolve){
    //子节点,跳转
   if(node.value instanceof Array){
   }
   //父节点,请求数据
   else{
    axios.post(appConfig.GET_ALL_ADMIN_INFO,{country:1,uperAdmin:node.value}).then( res => {
      let temp=[]
      res.data.DATA.map( v => {
        temp.push({
          label:v.NAME,
          value:formatGeomForPoint(v.GEOMETRY),
          leaf:true //配置是否为叶子节点
        })
      })
     resolve(temp)
    }).catch( e => {
console.log(e)
     
    })
  }
  }
},

效果图

 

 

element 级联选择器 省市联动