vben 添加一个独立展示的菜单栏，同时在切换的过程中不刷新

vben 添加一个独立展示的菜单栏，同时在切换的过程中不刷新

---

1、文件路径：src\router\routes\modules ，中添加对应的菜单文件。

—【注】—（以下内容皆是举例所用）

-name: 'Business3',​ //不可有重复

-component​：LAYOUT​ //加入页面框架

-redirect​：'/business/acc'​ //点击菜单时跳转到对应的子菜单路由

-meta​：hideChildrenInMenu​-true​ //隐藏子菜单展示

在children​中引入对应页面组件即可，name: 'Acc',

参考链接：关于页 - https://github.com/vbenjs/vue-vben-admin/blob/v2/src/router/routes/modules/about.ts

​
2、对应的组件文件中添加组件name​声明，（利用vue的，keep-alive实现菜单的缓存效果）

在vben中使用缓存多标签需要满足的条件：

• 在 src/settings/projectSetting.ts 内将openKeepAlive​ 设置为 true​

• 路由设置 name​，且不能重复

• 路由对应的组件加上 name​，与路由设置的 name​ 保持一致

vue3设置组件name的形式一：

<script lang="ts">
  export default {
    name: 'Acc',
  };
</script>

3、src\enums\basic\page.enum.ts，修改重定向url（贴合业务需要）

​​