当前位置: 首页 > article >正文

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

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

在这里插入图片描述

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

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

解决方案:

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

 <treeselect v-model="form.area" :normalizer="normalizer" :options="areaData" :show-count="true"
                placeholder="请选择地区" />

normalizer (node) {
	//子类为空,移除掉
    if (node.children && !node.children.length) {
      delete node.children
    }
    //这个如果不需要映射,直接返回node即可
    return {
      id: node.code,
      label: node.label,
      children: node.children,
    }
  },                

http://www.kler.cn/a/415633.html

相关文章:

  • 动态规划-斐波那契数列模型
  • Electron文件写入、读取(作用:公共全局变量,本地存储)
  • Python蒙特卡罗MCMC:优化Metropolis-Hastings采样策略Fisher矩阵计算参数推断应用—模拟与真实数据...
  • 海康面阵、线阵、读码器及3D相机接线说明
  • springboot-vue excel上传导出
  • hdlbits系列verilog解答(Exams/m2014 q4b)-87
  • Vba实现复制文本到剪切板
  • 从0开始学PHP面向对象内容之常用设计模式(享元)
  • linux下Qt程序部署教程
  • 设计模式学习之——观察者模式
  • 在openEuler中使用top命令
  • 【C++】list模拟实现(完结)
  • 电子电气架构 --- 面向服务的汽车诊断架构
  • 【docker】细致且具有时效性的docker在ubuntu的安装,新鲜出炉
  • python图像彩色数字化
  • PVE相关名词通俗表述方式———多处细节实验(方便理解)
  • 实践五 网络安全防范技术
  • Android复习代码1-4章
  • Codigger Desktop:多样 Look 设计,全新 Game Look 带来趣味体验
  • 数据结构——哈夫曼编码