element ui级联选择器数据处理

后端同事返回的级联选择器数据的children是childrens,而组件渲染只识别children,所以需要props自定义传入,代码如下

html 复制代码
<el-form-item label="应用页面:" prop="appId">
              <el-cascader
                :props="{ children: 'childrens' }"
                :options="options"
                v-model="formData.appId"
                clearable
                @change="handleChangecasca2"
              ></el-cascader>
            </el-form-item>

因为后端同事最后一层对象也返回了children,但是数据是空,这时候级联的最后一层就没法选择,所以需要将最后一层对象的children设置为undefine,这样子就可以选了

this.getTreeData(this.options); //传入数据处理

js 复制代码
	
    // 递归判断列表,把最后的children设为undefined
    getTreeData(data) {
      for (var i = 0; i < data.length; i++) {
        if (data[i].childrens.length < 1) {
          // children若为空数组,则将children设为undefined
          data[i].childrens = undefined;
        } else {
          // children若不为空数组,则继续 递归调用 本方法
          this.getTreeData(data[i].childrens);
        }
      }
      return data;
    },
相关推荐
songgz1 分钟前
洋葱式双向解析器演示(Ruby)
开发语言·后端·ruby
秋邱5 分钟前
AR 应用流量增长与品牌 IP 打造:从被动接单到主动获客
开发语言·人工智能·后端·python·ar·restful
源代码•宸5 分钟前
GoLang并发示例代码2(关于逻辑处理器运行顺序)
服务器·开发语言·经验分享·后端·golang
2503_928411561 小时前
12.4 axios的二次封装-深拷贝
前端·javascript·vue.js
你真的可爱呀4 小时前
uniapp+vue3项目中的常见报错情况以及解决方法
前端·vue.js·uni-app
郑州光合科技余经理7 小时前
同城系统海外版:一站式多语种O2O系统源码
java·开发语言·git·mysql·uni-app·go·phpstorm
一只乔哇噻7 小时前
java后端工程师+AI大模型开发进修ing(研一版‖day60)
java·开发语言·人工智能·学习·语言模型
LNN20227 小时前
Linuxfb+Qt 输入设备踩坑记:解决 “节点存在却无法读取“ 问题
开发语言·qt
差点GDP8 小时前
模拟请求测试 Fake Rest API Test
前端·网络·json
foxsen_xia8 小时前
go(基础06)——结构体取代类
开发语言·算法·golang