elementui中的tree自定义图标

需求:实现如下样式的树形列表

自定义树的图标以及点击时,可以根据子级的关闭,切换图标

html 复制代码
<el-tree 
    :data="treeList" 
    :props="defaultProps">
    <template #default="{ node, data }">
         <span class="custom-tree-node">
            <img v-if="!node.expanded " class="node-img" :src="./aaa.svg" />
            <img v-if="node.expanded" class="node-img" :src="./bbb.svg" />
             <span>{{ node.label }}</span>
          </span>
    </template>
</el-tree>

参考:element-ui的el-tree自定义图标 - 简书

https://download.csdn.net/blog/column/12320696/130819498

相关推荐
树下水月1 小时前
Typora破解
linux·服务器·前端
用户5508492902561 小时前
CSS布局实战:从Flex到Grid的完整避坑指南
前端
用户5508492902561 小时前
前端接口请求层怎么封装?一个可落地的请求方案
前端
MetWeave1 小时前
跟着一条 SPECI 走流水线:从电报到界面
前端
用户9177533718752 小时前
从零封装一个地图组件库:OpenLayers + Vue 的工程化实践
vue.js
Helix2502 小时前
Chrome 开发者工具进阶:长截图、网络调试与性能分析
前端·chrome·chrome devtools·使用技巧·性能分析·开发者工具·长截图
liangshanbo12152 小时前
面试题:Webpack 的 publicPath 有什么作用?
前端·webpack·node.js
mjhcsp2 小时前
DeepSeek V4.1 Flash 批量处理效能实测
java·前端·数据库
雪芽蓝域zzs3 小时前
第7节:多选模式、自定义选项渲染、受控弹窗显隐
vue.js·elementui
CHEEVEN_QY3 小时前
新能源汽车电池托盘FSW量产的工艺稳定性控制
java·前端·汽车