vue或者vue-cli3项目 用ivew组件库的tree组件时遇到的菜单展开问题

vue-cli3项目 用ivew组件库的tree组件时遇到的菜单展开问题 

根据官网上说的,只需要将每个需要展开的菜单命名,然后用open-names将要展开的菜单的名称写在后面的数组里即可,

如图所示:

2. 在各种排查后,可以确定数据的绑定也就是命名也是正确的,然后菜单的展开却有问题,我项目中在网页的头部也就是header中(工作台 学生管理 开课管理 .....部分)点击时改变数组中的值结合v-if来控制左侧菜单的显示与否,当首次打开网页时所有的菜单都展开了,但问题是:当我点击header中去切换过菜单后,就有子菜单没有展开了,不好描述直接上图吧,下图是当我进入网页点击系统设置后的左侧菜单的展开图,(正常的效果应该是菜单权限管理也展开的)但实际却没有.

正确的应该是下图所示的,但是只有在点击菜单权限管理后才会展开,很明显,点击后就触发了Tree组件的点击事件才展开的,而我要的效果是我打开网页的时候就展开的,如图:

排除了数据绑定的错误,官方给的样例也证明用open-names 可以将命名正确的菜单都展开,所以不应该出现我遇到的问题才对.

最后找了很久的bug,解决方法:

将控制菜单<menu> 在v-if 换成v-show,由于当我点击切换header中(工作台 学生管理 开课管理 .....部分)menu菜单中有些菜单的show会被赋值为false,如果用v-if 的话,会将menu销毁,导致的问题. 当我吧控制menu的v-if 换成v-show后无论header中(工作台 学生管理 开课管理 .....部分)怎么切换,都是正常展开了.

猜你喜欢

转载自blog.csdn.net/liuliu3636/article/details/88069960