Element-ui el-tree不同节点使用不同图标
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
<el-tree
v-if="openPanel"
ref="Vtree"
style="height: 610px"
:data="treeData"
highlight-current
class="filter-tree"
node-key="id"
:default-expanded-keys="[tree_default_check]"
:default-checked-keys="[tree_default_check]"
:accordion="true"
@node-click="handleNodeClick">
<span slot-scope="{ node, data }">
// type是节点类型,包含在treeData数据中,用于匹配每个Vnode显示哪种图标
<i :class="icons[data.type]" />
<span style="margin-left:5px;" :title="data.name">{{ data.name }}</span>
</span>
</el-tree>
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
data(){
icons:{
category:'categoryTreeIcons',
table:'tableIcon',
class:'classIcon'
},
}
CSS
.archives-classification .classIcon{background: url("../../icons/class.png") center no-repeat;padding: 1px 8px !important;}
.archives-classification .categoryTreeIcons{background: url("../../icons/category.png") center no-repeat;padding: 1px 8px !important;}
.archives-classification .tableIcon{background: url("../../icons/table.png") center no-repeat;padding: 1px 8px !important;}
GitHub 加速计划 / eleme / element
10
1
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:5 个月前 )
c345bb45
9 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 9 个月前
更多推荐
已为社区贡献7条内容
相关推荐
查看更多
element
10
A Vue.js 2.0 UI Toolkit for Web
element
0
element
0
A Vue.js 2.0 UI Toolkit for Web
热门开源项目
活动日历
查看更多
直播时间 2024-04-29 19:51:14
GitTalk | 使用面向业务的狮偶编程语言提升开发效率
直播时间 2024-04-26 19:50:36
GitTalk | DevUI Suits 场景解决方案
直播时间 2024-04-19 19:52:10
GitTalk | DevUI Admin 前端项目构建
直播时间 2024-04-12 19:19:21
GitTalk | AutoCoder实现下一代编程辅助应用
所有评论(0)