<el-menu-item></el-menu-item>中的index属性,接受的值必须为字符串或null,而我在使用该组件时是用v-for=“(item, index) of xxx”遍历,传入的参数时是index,为数字,不满足条件,故给出警告 所以调用toString()方法就好啦
1、数据绑定问题：在使用v-for指令循环渲染多个el-menu-item时，没有正确地使用冒号（：）来绑定数据。正确地使用了v-bind指令或者简写的冒号（：）来绑定数据。2、数据问题：菜单项的索引值没有正确设置，或者在渲染菜单项时出现了错误。检查数据源和渲染逻辑，确保每个菜单项都有一个唯一的索引值。3...
<el-menuclass="aside-menu"router :default-active="$route.path":collapse="isCollapse"background-color="#131b27"text-color="#bfcbd9"active-text-color="#20a0ff":default-active="$route.path":当前激活菜单的index,栏目与path做了匹配就拿到了path然后激活对应的item,当前打开了哪个页面,那么就会去找i...
<el-menu-item v-if="isAdmin" index="5">管理员页面</el-menu-item> 同时,可以通过数据绑定的方式动态设置菜单项的属性,例如: <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 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" /> ...
.menu-left/deep/.el-menu{ min-height:100%; background-color:#222653; } .menu-left.icon{ width:20px; margin-right:9px; } .menu-left/deep/.el-submenu__title, .menu-left/deep/.el-menu-item{ box-sizing: border-box; font-size:14px; ...
{ item.name }}</span> </el-menu-item> </template> </div> </template> <script> export default { name: "myitem", props: { data: { type: Array, default: [], }, }, // 注意: 在template标签上使用v-for,:key="index"不能写在template标签上,因为其标签不会被渲染,会引起循环错误 }...
通过上面的代码,我们可以看到el-menu的基本用法。在el-menu中,我们可以设置default-active属性来指定默认选中的菜单项,class属性用于设置菜单的样式。 在el-menu中,我们可以使用el-menu-item和el-submenu来生成菜单项和子菜单。其中,el-menu-item的index属性用于设置菜单项的唯一标识,slot="title"用于设置菜单项的标题...
使用的时候,最外层是el-menu,其上面属性,是用来配置整个菜单,如水平还是垂直、背景色、文字色、默认激活的菜单子项、默认展开的菜单子项等。 el-menu的子元素只有三种情况: el-menu-item 就是普通的菜单项 el-submenu 是菜单项里还有子菜单 el-menu-item-group 是菜单项组,就是好几个菜单项有个标题 网络异常...
menuItem.js 核心:判断菜单还有没有children,有children就递归,没有就展示菜单名 <template> <template v-for="item in arrList"> <el-menu-item v-if='!item.children' @click="toMenu(item)" :key="'/' + item.url" :index="'/' + item.url"> ...