Element UI tree control. Click on the parent node to load asynchronously. All data loaded asynchronously cannot be selected.

at present, all the selections can only be selected at the second level, and the third level is loaded asynchronously.

ask for help!

or there is no official asynchronous load to do the DEMO official document can not understand.

Element-ui vue.js
Apr.02,2021

Asynchronous loading cannot have multi-level data, but asynchronous loading can only be loaded at one level

paste my code

html 

    <el-tree
    :props="props"
    :load="loadNode"
    node-key='id'
    lazy
    ref="tree"
    :default-expanded-keys="[1]"
    show-checkbox
    >
    </el-tree>

js 

      loadNode(node, resolve) {
        console.log(node)
        if (node.level === 0) {
          return resolve([{ 'name': '',id:1}])
        }
        if(node.data.id == 1){
          this.getyiji(resolve)
          this.total = 1
        }
        if(node.data.provinceId){
          this.geterji(resolve)
        }
        if(node.data.cityID){
          this.getquyu(resolve)
        }
        if(node.data.areaId){
          this.getshequ(resolve)
        }
        if(node.data.type){
          return
        }
      },
      getshequ(resolve){
        axios.get('https://www.easy-mock.com/mock/5b21fa62cc17d07388c28b36/example/shequ').then(res=>{
            res.data.data.filter(i =>{
              i.leaf = true
              return
            })
            let data = res.data.data
            resolve(data)
        })
      },
      getquyu(resolve){
        axios.get('https://www.easy-mock.com/mock/5b21fa62cc17d07388c28b36/example/quyu').then(res=>{
            let data = res.data.data
            resolve(data)
        })
      },
      getyiji(resolve){
        axios.get('https://www.easy-mock.com/mock/5b21fa62cc17d07388c28b36/example/getJurisdiction').then(res=>{
            let data = res.data.data
            resolve(data)
        })
      },

Hello, I also encountered the same problem, asynchronously loaded data can not be selected, how do you achieve it?

Previous: Element header issu

Next: Mysql5.7 failed to create a foreign key! Have you been torturing me all day?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu