vue2 + el-menu实现路由跳转及当前项的设置方法实例

  

  

Vue。js(读音/vju& # 720;/,类似于视图)是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue采用自底向上增量开发的设计.Vue的核心库只关注视图层,它不仅易于上,手还便于与第三方库或既有项目整合。另一方面,当与单文件组件和Vue生态系统支持的库结合使用时,Vue也完全能够为复杂的单页应用程序提供驱动。

  

好了、下面通过本文给大家介绍vue2 + el-menu实现路由跳转及当前项的设置方法,具体内容如下所示:

        & lt;跨深=" 5 "祝辞& lt; el-menu路由器:default-active=" $路线。路径”class=" el-menu-vertical-demo " @open=" handleOpen " @close=" handleClose”主题="黑暗"比;   & lt; el-submenu指数=?”比;   & lt;模板槽=氨晏狻北?   & lt;我类=" el-icon-location "祝辞& lt;/i>   & lt; span>用户信息& lt;/span>   & lt;/template>   & lt; el-menu-item-group>   & lt; el-menu-item指数="/user/账户”在账号信息& lt;/el-menu-item>   & lt; el-menu-item指数="/用户/密码”在修改密码& lt;/el-menu-item>   & lt;/el-submenu>   & lt; el-submenu指数=?”在   & lt;模板槽=氨晏狻北?   & lt;我类=" el-icon-location "祝辞& lt;/i>   & lt; span>公司信息& lt;/span>   & lt;/template>   & lt; el-menu-item-group>   & lt; el-menu-item指数="/公司/userManager”在用户管理& lt;/el-menu-item>   & lt; el-menu-item指数="/公司/editUser "祝辞添加/编辑用户& lt;/el-menu-item>   & lt;/el-menu-item-group>   & lt;/el-submenu>   & lt;/el-menu> & lt;/span>之前      

1。要实现路由跳转,先要在el-menu标签上添加路由器属性,然后只要在每个el-menu-item标签内的指数属性设置一下url即可实现点击el-menu-item实现路由跳转。
  

  

2。导航当前项,在el-menu标签中绑定,:<代码> default-active=" $ route.path ">   

  

以上所述是小编给大家介绍的vue2 + el-menu实现路由跳转及当前项的设置方法实例,希望对大家有所帮助,如果大家有任何疑问请给我留的言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

vue2 + el-menu实现路由跳转及当前项的设置方法实例