element plus的一个组件使用小问题求教
官网地址:https://element-plus.org/zh-CN/component/menu.html#menu-item-attributes有大佬用过这个功能吗?
<el-menu :collapse="isCollapse" @open="handleOpen" @close="handleClose" unique-opened router
style="height: 100vh; width: 100%;" default-active="1">
<el-sub-menu v-for="(value, index) in params.router_lists" :key="value.name" :index="`${index}`">
<template #title>
<el-icon>
<FullScreen />
</el-icon>
<span>{{ $t(value.meta.title) }}</span>
</template>
<el-menu-item v-for="(item, child_index) in value.children" :key="child_index"
:route="{ name: item.name }">
{{ $t(item.meta.title) }}
<!-- Debug: 输出name以确保其有效 -->
<!-- <div>{{ item.name }}</div> -->
</el-menu-item>
</el-sub-menu>
</el-menu>
这个是我自己写的静态路由,赋值给了变量params.router_lists
[
{
"path": "/setup/",
"name": "setup",
"meta": {
"title": "navi_left.permission_setup",
"keepAlive": true,
"father": true,
"icon": "School"
},
"props": {
"default": false
},
"children": [
{
"path": "departement/",
"meta": {
"title": "navi_left.department",
"keepAlive": true,
"icon": "School"
},
"name": "DeparteMent1",
"hidden": true
},
{
"path": "user/",
"meta": {
"title": "navi_left.usermanage",
"keepAlive": true,
"icon": "School"
},
"name": "User1",
"hidden": false
},
{
"path": "menu/",
"meta": {
"title": "navi_left.menumanage",
"keepAlive": true,
"icon": "School"
},
"name": "Menu1",
"hidden": false
}
],
"instances": {
"default": {}
},
"leaveGuards": {},
"updateGuards": {},
"enterCallbacks": {},
},
{
"path": "/vul/",
"name": "Vul",
"meta": {
"title": "navi_left.vul",
"keepAlive": true,
"father": true,
"icon": "School"
},
"props": {
"default": false
},
"children": [
{
"path": "vulinfo/",
"meta": {
"title": "navi_left.vul_info",
"keepAlive": true,
"icon": "School"
},
"name": "VulInfo1",
"hidden": false
},
{
"path": "vulaudit/",
"meta": {
"title": "navi_left.vul_audit",
"keepAlive": true,
"icon": "School"
},
"name": "VulAudit1",
"hidden": false
}
],
}
]
现在就是页面可以正常显示,但是点击路由跳转就没办法按路由name信息跳转
抱歉，我是后端，但是报错、有事甩给ai 静态路由是不是缺少了 component 路由文件缺少了对应的组件引入把 一看就是缺少 component 属性，
本帖最后由 li19980414 于 2024-11-14 11:31 编辑
<el-menu router>
你在这里给了router`是否启用 vue-router 模式。 启用该模式会在激活导航时以 index 作为 path 进行路由跳转 使用 default-active 来设置加载时的激活项。`
跳转的时候用 path 去跳了 本帖最后由 li19980414 于 2024-11-14 11:40 编辑
https://attach.52pojie.cn/forum/202411/14/091848xs834t3p8uxevtp4.png
去掉el-menu上定义的router 试试 或者自己实现一个吧，简洁有好用 li19980414 发表于 2024-11-14 11:29
你在这里给了router`是否启用 vue-router 模式。 启用该模式会在激活导航时以 index 作为 path 进行 ...
所以跳转只能用path不能用name跳是吧 li19980414 发表于 2024-11-14 11:39
去掉el-menu上定义的router 试试
router和route是不同的参数,router表示总开关只有router开启才能用route
页:
[1]
2