最近，通过学习vue创建可伸缩侧栏的记录显示，很多管理系统中用于管理系统的一般较长的差距不大
首先是收纳的时候
展开的时候
首先是制作新的Layout.vue
展开
收纳
name:'Layout '，
组件： {
Sidebar
(，
数据() {return{
isCollapse:false，' menuList': [
与{'path': '1'，//菜单项对应的路由路径
' title': '功能1 '，//菜单项名称
' children':[] //是否有子菜单，如果没有[]
(，
{'path': '2'，' title': '功能2 '，' children':[]
(，
{'path': '3'，' title': '功能3 '，' children': [
{'path': '3-1'，' title': '功能3-1 '，' children':[]
(，
{'path': '3-2'，' title': '功能3-2 '，' children':[
{'path':'3-2-1'，' title': '功能3-2-1 '，' children':[]
}
]
(，
{'path': '3-3'，' title': '功能3-3 '，' children':[]
(，
]
(，
{'path':'4'，' title': '功能4 '，' children':[
{'path':'4-1'，' title': '功能4-1'}
]
}
]
}
(，
methods: {
手动打开(key，keyPath ) {
控制台. log (key，keyPath )；
(，
手动关闭(key，keyPath ) {
控制台. log (key，keyPath )；
}
}
}
SideBar.vue
name:'Sidebar '，
组件： { sidebar item }，
props:{
menuList: {
类型：阵列，
required :真}，
collapse:{
类型： boolean，default:false}
(，
methods: {
手动打开(key，keyPath ) {
控制台. log (key，keyPath )；
(，
手动关闭(key，keyPath ) {
控制台. log (key，keyPath )；
}
}
}
width: 200px；
最小-高： 400 px；
}
SidebarItem.vue
{{item.title}}
{{item.title}}
v-if=' child.children child.children.length0' : item=' child ' 3360 key=' child.path ' /
{{child.title}}
name:'SidebarItem '，
props: {
item: {
类型：对象，
required :真}，
collapse:{
类型： boolean，default:false}
}
}
中间不知道为什么
{{item.title}}
这里的titlle怎么也掩盖不了收藏时我给element官网的例子。 之后，没能把collapse带到这个组件上。 用v-show设定，每个大神都知道为什么，请出示