vue + el-menu(Element-UI)之路由跳转

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

2.导航当前项,在el-menu标签中绑定  :default-active="$route.path",注意是绑定属性,不要忘了加“:”,当$route.path等于el-menu-item标签中的index属性值时则该item为当前项。

<el-menu
      :default-active="$route.path"
      :collapse="isCollapse"
      :background-color="variables.menuBg"
      :text-color="variables.menuText"
      :active-text-color="variables.menuActiveText"
      :unique-opened="false"
      :collapse-transition="false"
      router
      mode="vertical"
    >
      ......
    </el-menu>
<el-menu-item
      :index="path"   // vue得route对象里的path
>
......
</el-menu-item>

 

 

转载:https://blog.csdn.net/qq_37281252/article/details/78460159

posted @ 2019-10-28 15:11  seeBetter  阅读(8384)  评论(0编辑  收藏  举报