位置: IT常识 - 正文
推荐整理分享NavMenu导航菜单el-submenu点击事件及激活状态变化(导航菜单是什么),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:导航菜单模板,导航菜单的定义,导航菜单栏,导航菜单图标,导航菜单栏,nav导航栏,nav导航栏,nav导航栏,内容如对您有帮助,希望把文章链接给更多的朋友!
原因: 由于项目的需求变化,原本是点击二级子菜单才发生跳转,点击子菜单后,el-menu组件也会执行@select的方法,导航栏的菜单也会对应变成激活状态。但是,需求变成点击一级菜单也可以发生跳转,默认跳转到第一个子菜单的界面,el-menu没有实现可以点击el-submenu这一功能。
解决方案: 1.在el-submenu标签添加点击事件,@click.native,然后再从点击事件内实现跳转等事务,因为我的功能是默认跳转到第一个子菜单,故复用了@select的方法
注意:单纯使用@click没有效果 2.当前激活状态的改变,el-menu组件的:default-active属性等于当前的激活状态的菜单绑定的:index 所以,可以在data增加一个变量activeIndex,用来记录当前激活状态的菜单的:index的值, 然后el-menu组件的:default-active由变量activeIndex来控制。
每次点击菜单时,在@select的点击事件(因为我复用了这个方法)最后给变量activeIndex赋值当前的菜单的:index 即可。
上一篇:Monaco Editor教程(二二):monaco编辑器完整配置翻译及重点配置解析(monaco编辑器的自定义提示)
下一篇:阿查法拉亚盆地中的一棵柏树,路易斯安那州 (© Chris Moore/Tandem Still + Motion)(阿查法拉亚盆地 钓鱼)
友情链接: 武汉网站建设