Vue可折叠树形递归组件
1.前期准备
（1）数据文件（这里提供json数据文件的贴图，需要的小伙伴去我的GitHub下载Detail.json文件，在文末），我将文件放置在static目录下新建的mock目录下。
2.组件创建
（1）Detail.vue组件，该组件用于使用axios获取json数据，同时将此组件挂载在App.vue上
第一步：在Pages(自己新建的目录，可以使用模板自带的components目录)下创建Detail.vue文件，在App.vue中注册该组件
第二步：在Detail.vue组件中引入axios,然后在mounted的钩子函数内执行getDetailInfo（）方法，该方法调用axios的方法获取json文件里的数据,再执行show（）方法将axios获取的数据添加到data里的空数组List里面。
（3）递归组件MessageDetail.vue的创建，将其引入Detail.vue组件中，注册后使用v-for循环遍历出相应个数的（一级目录下menuName的个数，这里为3，因此在Detail.vue里有3个MessageDetail.vue组件）的MessageDetail.vue组件。同时向MessageDetail.vue组件里传递数据，传递是相应一级目录的字段的子目录children数组(例如项目管理一级目录下的children数组)，这里的数组和字段会随着递归的进行向下替换，第一次是的字段是项目管理，数组是项目管理的children数组，第二次的字段是children下的1.1项目,数组是1.1项目下的children数组，一直循环至结束。
（4）在MessageDetail.vue文件中props获取相应的字段和数组。在template中添加显示。
（5）然后给每个children数组绑定一个v-show,由字段绑定的点击事件控制它的展开和收起。