element 级联框懒加载

重点在于props，在js文件中进行定义

data(){
  return {
   props: {
    //设置为懒加载的模式
    lazy: true,
    value: 'value',
    expandTrigger: 'click',
    lazyLoad(node, resolve) {
      const { level, root, data } = node
      //判断为根节点时入参queryType的值为0，deptCode为null
      if (root) {
        http
          .post('/xx/xx', { deptCode: null, queryType: 0 })
          .then((res) => {
            const result = res.data.map((item) => ({
              label: item.deptName,
              value: item.deptCode,
              //leaf标明节点是不是叶子节点，在这里表示当为第三级（即level为2时就是叶子节点，不会再调接口加载选项）
              leaf: level >= 2,
            }))
            //  将结果resolve出去，result就是我们想要的数据
            resolve(result)
          })
          .catch((res) => {
            console.log(res)
          })
      } else {
        http
          .post('/iot/queryDepartments', {
            deptCode: data.value,
            queryType: 0,
          })
          .then((res) => {
            const result = res.data.map((item) => ({
              label: `${item.deptCode}${item.deptName}`,
              value: item.deptCode
            }))
            resolve(result)
          })
          .catch((res) => {
            console.log(res)
          })
        }
    },
  },
 }
 }

如果业务逻辑没那么复杂，只是点击选项就会调接口请求数据的话，

data(){
  return {
   props: {
    //设置为懒加载的模式
    lazy: true,
    value: 'value',
    expandTrigger: 'click',
    lazyLoad(node, resolve) {
        http
          .post('/xx/xx', { xxx })
          .then((res) => {
            const result = res.data.map((item) => ({
              label: item,
              value: item,
            }))
            //  将结果resolve出去，result就是我们想要的数据
            resolve(result)
          })
          .catch((res) => {
            console.log(res)
          })
      } 
  },
 }
 }