• ant design vue中使用TreeSelect懒加载


    项目中使用下拉机构懒加载,tree Select控件。

           <a-tree-select
                v-model="form1.constructionCompany"
                style=" 100%"
                :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
                :getPopupContainer="(triggerNode) => triggerNode.parentNode"
                :replace-fields="{children:'children', key:'id', value: 'label'}"
                :tree-data="orgTree"
                :load-data="onLoadData"
                placeholder="请选择施工单位"
                allow-clear>                           
            </a-tree-select>
    

      其中要指定唯一的key值,我这里id是唯一的

           onLoadData(treeNode) {
              const _this = this;
              return new Promise((resolve) => {
                if (Array.isArray(treeNode.dataRef.children) && treeNode.dataRef.children.length) {
                  console.log('treeNode.dataRef.children', treeNode.dataRef.children);
                  resolve()
                  return
                } 
                //如果没有值,根据当前节点id获取子节点并挂在树节点中,添加到对应父节点的children中
                publicapi.constructionQueryOrg(treeNode.dataRef.id).then((res) => {
                    treeNode.dataRef.children = res;
                    _this.orgTree = [..._this.orgTree];
                    console.log('treeNode.dataRef.children', treeNode.dataRef.children);
                }).catch();
                resolve()
              })
            }
    

      

  • 相关阅读:
    matlab2016b和c# .net4.0混合编程
    有限元入门
    math.net 拟合
    excel 错误提示以及其他基础知识
    excel的小bug
    Servlet体系及方法
    Servlet学习笔记
    HTTP协议
    Tomcat
    反射
  • 原文地址:https://www.cnblogs.com/theblogs/p/14791268.html
Copyright © 2020-2023  润新知