VUE移动端树形组件的封装实现 VUE移动端树形组件的封装实现

前言

近期移动端项目中遇到个需求，数据需要树形显示。找了一些插件觉得不太适合，就看了看相关文章以及视频，想着以学习和积累的态度，就自己封装了个tree的树形展示组件。学习到了组件在它的模板内可以递归地调用自己，直接上代码吧~

子组件代码

.anime_time { transition: all 0.3s; } .dis_flex { display: flex; align-items: center; } .experTree { &_info { @extend .dis_flex; height: 48px; justify-content: space-between; .experTree_bar { @extend .dis_flex; height: 100%; flex: 1; .icon { width: 38px; height: 38px; &.vertical { transform: rotate(90deg); @extend .anime_time; } &.normal { @extend .anime_time; } } } .experTree_select { color: $mainColor; padding: 5px; box-sizing: border-box; } } }