VUE elTree 无子级 隐藏展开图标

这4个并没有下级节点,即它并不是叶子节点,就不需求展示前面的三角展开图标!

查阅官方文档如下描述,支持bool和函数回调处理,这里咱们选择更灵活的函数回调实现。

给el-tree结构配置一下props,注意! :props="defaultProps"

javascript 复制代码
<el-tree :data="treeList" :props="defaultProps" @node-click="handleNodeClick"></el-tree>

在data中添加配置项,如下:isLeaf是一个函数,subCount 是接口返回的表明此节点是否还有可展开项的标记,大于1时说明还有下级需要展开,否则不要展开

defaultProps: {
    children: 'children',
    label: 'id',
    isLeaf: (data, node) => {
        return data.subCount >= 1 ? false : true
    }
}

完成后,刷新页面显示正常,不再给用户制造操作误途

相关推荐
三门4 小时前
vue官网新读之后收获记录
前端
Keepreal4964 小时前
使用Canvas绘制转盘
javascript·vue.js·canvas
mapbar_front4 小时前
我们需要前端架构师这个职位吗?
前端
ScriptBIN4 小时前
Javaweb--Vue
前端·vue.js
KenXu4 小时前
React Conf 2025 - 核心更新
前端
前端Hardy4 小时前
Vue 高效开发技巧合集:10 个实用技巧让代码简洁 50%+,面试直接加分!
前端·javascript·vue.js
ᖰ・◡・ᖳ5 小时前
JavaScript:神奇的ES6之旅
前端·javascript·学习·es6
app出海创收老李5 小时前
海外独立创收日记(5)-上个月收入回顾与本月计划
前端·后端·程序员
前端Hardy5 小时前
HTML&CSS:一眼心动的 SVG 时钟
前端·javascript·css
TTGGGFF5 小时前
Streamlit:CSS——从基础到实战美化应用
前端·css