Vue-TreeSelect组件最下级隐藏No sub-options

问题:最下级没有数据的话,去除No sub-options信息

为什么没下级,会展示这个?

整个树形结构数据都是由后端构造好返回给前端的。默认子类没数据的话,children是一个空数组。也就是因为这最下级的空数组,导致最下级显示这段文字提示。

解决方案:

后端解决,那么如果子类没数据,children给null 空值或去除该属性。
前端解决:直接贴上代码

html 复制代码
 <treeselect v-model="form.area" :normalizer="normalizer" :options="areaData" :show-count="true"
                placeholder="请选择地区" />
javascript 复制代码
normalizer (node) {
	//子类为空,移除掉
    if (node.children && !node.children.length) {
      delete node.children
    }
    //这个如果不需要映射,直接返回node即可
    return {
      id: node.code,
      label: node.label,
      children: node.children,
    }
  },                
相关推荐
姜 萌@cnblogs1 分钟前
【实战】深入浅出 Rust 并发:RwLock 与 Mutex 在 Tauri 项目中的实践
前端·ai·rust·tauri
蓝天白云下遛狗9 分钟前
google-Chrome常用插件
前端·chrome
多多*1 小时前
Spring之Bean的初始化 Bean的生命周期 全站式解析
java·开发语言·前端·数据库·后端·spring·servlet
linweidong1 小时前
在企业级应用中,你如何构建一个全面的前端测试策略,包括单元测试、集成测试、端到端测试
前端·selenium·单元测试·集成测试·前端面试·mocha·前端面经
满怀10151 小时前
【HTML 全栈进阶】从语义化到现代 Web 开发实战
前端·html
繁依Fanyi1 小时前
用 UniApp 构建习惯打卡 App —— HabitLoop 开发记
javascript·uni-app·codebuddy首席试玩官
东锋1.31 小时前
前端动画库 Anime.js 的V4 版本,兼容 Vue、React
前端·javascript·vue.js
满怀10152 小时前
【Flask全栈开发指南】从零构建企业级Web应用
前端·python·flask·后端开发·全栈开发
小杨升级打怪中2 小时前
前端面经-webpack篇--定义、配置、构建流程、 Loader、Tree Shaking、懒加载与预加载、代码分割、 Plugin 机制
前端·webpack·node.js
Yvonne爱编码2 小时前
CSS- 4.4 固定定位(fixed)& 咖啡售卖官网实例
前端·css·html·状态模式·hbuilder