在el-menu组件中,el-menu-item用于表示菜单项。当你希望点击某个菜单项跳转到外部链接时,index属性并不是用来填写外部链接的。实际上,index属性主要用于标识菜单项,通常用于内部路由跳转或触发特定事件。 以下是关于如何在el-menu-item中实现跳转到外部链接的详细解答: 理解el-menu-item组件的用途和属性: el-menu...
<el-menu-item></el-menu-item>中的index属性,接受的值必须为字符串或null,而我在使用该组件时是用v-for=“(item, index) of xxx”遍历,传入的参数时是index,为数字,不满足条件,故给出警告 所以调用toString()方法就好啦
el-menu-item遍历后台传回的数据时,设置:index="item.name" 会报错如下: image.png 解决办法: index的值不能有空格,并且是字符串类型,我上面是自己接受到数据遍历添加的一个下标,把他转为字符串就不会报错了 image.png
而且/index这个路由在menus中也找不到,所以就默认匹配index===null的路由了?于是给el-menu-item加上index,果然好了。 总结 el-menu el-menu-item一定要设置唯一index。
el-menu-item遍历后台传回的数据时,设置:index="item.name" 会报错如下:解决办法:index的值不能有空格,并且是字符串类型,我上面是自己接受到数据遍历添加的一个下标,把他转为字符串就不会报错了
</el-menu> 在这个例子中,我们创建了一个el-menu组件,并在其中添加了三个el-menu-item组件。每个el-menu-item组件都有一个index属性,表示该菜单项的唯一标识符。这个标识符可以用于在父级菜单中选中或展开子菜单项。 除了index属性,el-menu-item还支持其他的一些属性,例如: command:绑定一个命令函数,当点击该...
<el-menu-item index="/spectrogram/">谱图分析</el-menu-item> </el-menu> data(){return{activeIndex:'/device_new/',title:'设备管理'} },mounted() {this.activeIndex=this.$route.path}, 情况二:嵌套路由,当选中子路由时父级菜单要高亮显示,单前选中菜单也是被选中的颜色;(如下图) ...
el-menu的用法如下: el-menu-item是组件元素。 el-menu-item可直接在el-menu中使用。 el-menu-item也可插入元素。 el-menu-item-group是组件组,可包含el-menu-item以及模板插槽。 此外,el-menu还有以下属性: index:唯一标志。 popper-class:为popper添加类名。 show-timeout:展开sub-menu的延时。 hide-time...
<el-menu :default-active="activeIndex"> <el-menu-item v-for="item in menuItems" :key="item.index" :index="item.index"> {{ item.name }} </el-menu-item> </el-menu> 其中,menuItems是一个包含菜单项信息的数组,可以根据实际情况进行动态生成或从后端获取。
<el-menu-item index="4-4-1">选项1</el-menu-item> <el-menu-item index="4-4-2">选项2</el-menu-item> <el-menu-item index="4-4-3">选项3</el-menu-item> </el-submenu> --> </el-submenu> <el-menu-item index="5" route="/PP/PP_Energy">能耗统计</el-menu-item> ...