el-menu 添加 :default-active=“this.$router.path” 和 router (default-active前面要有 “:” ) router.js文件下应该配置好路由路径。建议用路由懒加载方式 //import main from './pages/main.vue'Vue.use(Router); exportdefaultnewRouter({ mode:'history', routes:[ {path:'/',component: resolve =...
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属性值时...
在router.js里设置路由时,给相同导航高亮的路由设置相同的name属性,如图: 然后在menu组件上设置default-active的值为:$route.name,这样就可以实现刷新时导航栏选中当前页的问题。最后设置el-menu-item的index属性为router.js文件里跳转路由的name值,route属性为:路由的path,如图: 通过这样设置,就可以实现刷新页面时,...
10 注意事项：1，刷新定位当前路由，需要在el-menu标签中定义:default-active="$route.path"，这样当你刷新路由时就会自动定位但当前的路由位置。2，el-submenu和el-menu-item标签中的index属性定义，需要解析下路由将要跳转的路由赋给index。
<el-menu ref="menu" mode="vertical" router :default-active="$route.path" :collapse-transition="false" :collapse="$store.state.dcp.sidebar.isCollapsed" @select="checkLink" > <menu-item v-for="route in filteredMenu" :key="route.path" :item-route="route" :base-path="route.path" /> ...
<el-menu router> <el-menu-item v-for="item in menuList" :index="item.route" :key="item.id">{{item.name}}</el-menu-item> </el-menu> ``` 4.在上面的示例代码中,menuList是从后端返回的菜单数据,根据menuList动态生成了菜单项和路由。 三、路由钩子 1.在el-menu中使用router还可以结合vue...
url:'/firm'}]}...]<el-menuclass="header-menu"mode="horizontal"active-text-color="#419eff":default-active="$route.path"@select="handleSelect"><templatev-for="(item, index) in menus"><el-submenuv-if="item.children"popper-class="header-submenu":key="item.name":index="item.url"><...
</el-menu-item> </el-menu> 在上述示例中,我们在<router-link>标签的to属性中使用了一个对象来指定子路由的路径和query参数。其中,path指定了主路由的路径,query用于携带参数。 在主页面中,我们可以通过route对象的query属性来获取传递的参数。例如: javascript export default { created() { console.log(this...
Bug Type: Component Environment Vue Version: 3.5.12 Element Plus Version: 2.8.8 Browser / OS: 131.0.6778.86(正式版本) (64 位) Build Tool: Vite Reproduction Related Component el-menu-item Reproduction Link Element Plus Playground Steps to repr...
<el-menu router>router属性开启了路由,当点击了二级菜单比如用户列表即<el-menu-item>,<el-menu-item>,的index属性规定了激活的路由,如果index='/users'则会跳转到/users的路由。 但是这里有个坑: 比如右边即Users.vue有个面包屑导航区代码如下,结合下面的路由配置,可知点击首页会跳转到路由/wellcome,但是用户列...