您现在的位置是：网站首页> 编程资料编程资料
VUE递归树形实现多级列表_vue.js_
2023-05-24
315人已围观
简介 VUE递归树形实现多级列表_vue.js_
本文实例为大家分享了VUE递归树形实现多级列表，供大家参考，具体内容如下
什么是递归?
简单来说就是在组件中内使用组件本身。
为什么要用递归？
如果出现很多下拉菜单，同级，分级数据，层级混杂，可以使用v-for的嵌套循环不就完事了。对，没毛病这样的话也可以做，但是如果数据又多加了【很多】级分类呢；使用v-for也能实现，但是代码可能会比较杂或混乱！也不适合后期的维护，这个时候呢，我们就可以使用我们所说道的【递归组件 】了，使用递归组件，无论你的数据怎么增加我们都不用改动我们的代码。
先看效果：
1、创建两个文件
父组件tree.vue 子组件tree-detail
父组件代码：
子组件代码：
//btn是用来切换显示隐藏 {{flag ? '-' :'+'}} {{title}} //接收到的标题//这里加显示隐藏也是必要的
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
您可能感兴趣的文章:
相关内容
- vue+quasar使用递归实现动态多级菜单_vue.js_
- 浅谈JS中var,let和const的区别_javascript技巧_
- vue实现多级侧边栏的封装_vue.js_
- 梳理总结JavaScript的23个String方法_javascript技巧_
- Vue实现文件批量打包压缩下载_vue.js_
- Vue3.0实现无限级菜单_vue.js_
- vue3 diff 算法示例_vue.js_
- JavaScript中Array的filter函数详解_javascript技巧_
- npm run dev失败的简单解决办法_vue.js_
- 教你应用 SOLID 原则整理 React 代码之单一原则_React_
