iview级联选择器懒加载

html:

 <Cascader
      :data="data.treeData"
      v-model="selectVal"
      :load-data="loadData"
      @on-change="getNode"
      change-on-select
      style="width: 100%"
      ref="cascader"
      placeholder="请选择代码目录"
      @on-visible-change="visibleChange"
      clearable
    ></Cascader>

 js:

const visibleChange = (visible) => {
  if (visible) {
    data.treeData = [];
    let codeTreeData = getCodeTreeData.value.filter(
      (item) => item.type == "folder"
    );
    codeTreeData.forEach((item) => {
      data.treeData.push({
        label: item.name,
        value: item.id,
        loading: false,
        children: [],
      });
    });
  }
};
const loadData = (item, callback) => {
  item.loading = true;
  loadChildFolder(item, () => {
    // debugger;
    let children = item.children || [];
    if (children.length === 0) {
      delete item.children;
      delete item.loading;
    }
    for (let child of children) {
      loadData(child, callback);
    }
    callback();
  });
};

const loadChildFolder = (item1, callback) => {
  item1.children = [];
  let path = proxy.GlobalUrl.ANALYSIS.GETDIRDATA;
  let params = {
    projectId: window.localStorage.getItem("projectId"),
    itemId: item1.value,
  };
  proxy.http.get(path, params).then((resault) => {
    if (resault.data.code === 0) {
      item1.loading = false;
      let data = resault.data.data.directoryList;
      if (data.length > 0) {
        data.forEach((item) => {
          let tempData = {
            label: item.name,
            value: item.id,
            loading: false,
            children: [],
          };
          if (item1.children) {
            item1.children.push(tempData);
          }
        });
        callback();
      } else {
        delete item1.children;
        delete item1.loading;
      }
    }
  });
};

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值