小白灿灿子 2023-03-10 16:08 采纳率: 72%
浏览 21
已结题

el-cascader回显失败,修改一下代码保存就会回显掉接口

el-cascader:懒加载子级数据 调接口 ,重新打开有3级菜单的控件,调接口回显不显示,没有调第二级的接口

  <el-cascader
                class="item_cascader"
                style="width: 100%"
                v-model="item.expansionAttribute.AllCity"
                :props="props"
                :placeholder="placeholder"
                @change="
                  inputChange(
                    dataObj,
                    code,
                    item.expansionAttribute.AllCity,
                    tableId,
                    index,
                    item
                  )
                "
                @paste.native="
                  pasteControl($event, itemData, index, colIndex, code)
                "
                @focus="focusColumn(itemData[code])"
                :disabled="!item.editable"
                :id="contolid"
                :style="computedStyle(item, index)"
                ref="cascader"
                clearable
                filterable
                show-all-levels="true"
              >
              </el-cascader>

data() {
    return {
    
      props:{
              label:'name',
              value:'code',
              lazy: true,
              lazyLoad:(node, resolve) =>{  
               debugger
                  if(node.level == 0 ){
                    if(this.item.expansionAttribute.cellAddress == 1){
                      node.level == 0;
                    }
                      this.queryTree(node, resolve)
                  }
                  else if(node.level == 1){
                    if(this.item.expansionAttribute.cellAddress == 2){
                      node.level == 1
                    }
                    this.queryMoreTree(node, resolve)
                  }
                  else{
                    node.level == 2
                    this.queryEndTree(node, resolve);
                  }
                 
              }
          }
    };
  },
methods:{
 //获取第一级单位
    queryTree(node, resolve) {
      //此处要将本单位id作为参数提交
      var obj = {
        province: 1,
      };
      GetProvince(obj).then((res) => {
        var arr = [];
        res.result.forEach((element) => {
          var obj1 = {
            code: element,
            name: element,
            // hasChildren:true
          };
          arr.push(obj1);
        });
        if (this.item.expansionAttribute.cellAddress == 1) {
          arr.forEach((item) => {
            item.leaf = true;
            return {
              code: item.code,
              name: item.name,
              leaf: item.leaf,
            };
          });
        } else {
          arr.forEach((item) => {
            return {
              code: item.code,
              name: item.name,
              leaf: false,
            };
          });
        }
        resolve(arr);
      });
    },
    //获取第二级单位
    queryMoreTree(node, resolve) {
      debugger
      //注意此处要将node.value,也就是点击的节点单位的id,作为查询被点击单位下级单位的参数提交
      var obj = {
        province: 2,
        provincestr: node.label,
      };
      GetProvince(obj).then((res) => {
        var arr = [];
        res.result.forEach((element) => {
          var obj1 = {
            code: element,
            name: element,
            // hasChildren:true
          };
          arr.push(obj1);
        });
        if (this.item.expansionAttribute.cellAddress == 2) {
          arr.forEach((item) => {
            item.leaf = true;
            return {
              value: item.id,
              label: item.text,
              leaf: item.leaf,
            };
          });
        } else {
          arr.forEach((item) => {
            return {
              value: item.id,
              label: item.text,
            };
          });
        }
        resolve(arr);
      });
    },
    queryEndTree(node, resolve) {
      //注意此处要将node.value,也就是点击的节点单位的id,作为查询被点击单位下级单位的参数提交     
      var obj = {
        province: 3,
        provincestr: node.pathLabels[0],
        citystr: node.pathLabels[1],
      };
      GetProvince(obj).then((res) => {
        var arr = [];
        res.result.forEach((element) => {
          var obj1 = {
            code: element,
            name: element,
            hasChildren: false,
          };
          arr.push(obj1);
        });
        arr.forEach((item) => {
          item.leaf = !item.hasChildren;
          return {
            value: item.id,
            label: item.text,
            level: true,
          };
        });
        resolve(arr);
      })
    },
}

  • 写回答

3条回答 默认 最新

  • threenewbee 2023-03-10 16:16
    关注

    用抓包的工具看看,是否返回了数据,是否存在跨域问题。

    评论

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 3月21日
  • 创建了问题 3月10日

悬赏问题

  • ¥15 两台交换机分别是trunk接口和access接口为何无法通信,通信过程是如何?
  • ¥15 C语言使用vscode编码错误
  • ¥15 用KSV5转成本时,如何不生成那笔中间凭证
  • ¥20 ensp怎么配置让PC1和PC2通讯上
  • ¥50 有没有适合匹配类似图中的运动规律的图像处理算法
  • ¥15 dnat基础问题,本机发出,别人返回的包,不能命中
  • ¥15 请各位帮我看看是哪里出了问题
  • ¥15 vs2019的js智能提示
  • ¥15 关于#开发语言#的问题:FDTD建模问题图中代码没有报错,但是模型却变透明了
  • ¥15 uniapp的h5项目写一个抽奖动画