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;
    },
相关推荐
Csvn3 小时前
OpenSpec 详细使用教程
前端
方也_arkling4 小时前
【Java-Day08】static / final / 枚举
java·开发语言
风吹夏回4 小时前
Python 全局异常处理:从“满屏 try-except”到优雅兜底
开发语言·python
Chengbei114 小时前
一站式源码安全检测工具、云安全 / APP / 小程序源码敏感信息递归多层目录扫描AK、JWT、手机号、身份证等敏感信息
java·开发语言·安全·web安全·网络安全·系统安全·安全架构
llz_1124 小时前
web-第一次课后作业
java·开发语言·idea
小熊Coding4 小时前
Python爬取当当网二手图书项目实战!
开发语言·爬虫·python·beautifulsoup·requests·二手图书
之歆4 小时前
Day19_LESS 完全指南——从入门到工程实践
前端·css·less
秋94 小时前
Java项目运行5天左右自动宕机:系统性定位与解决方案
java·开发语言·python
xiaoshuaishuai85 小时前
C# 内存管理与资源泄漏
开发语言·c#
云水一下5 小时前
HTML5 从入门到精通:实战收官——从零搭建完整静态网站,综合运用所有知识
前端·html5