15、springboot3 vue3开发平台-前端-路由构建, 使用路由守卫,加载动态路由,pinia管理路由缓存数据

1. 创建菜单路由pinia管理

  • 通过searchSelfMenusService 从后端请求菜单树列表, 菜单树查询构建内容见前变后端部分菜单列表树部分
    src\stores\menu.ts
  • vue3 动态加载组件要使用 import.meta.glob(‘…/views/**/*.vue’)
  • 使用elementplus el-menu 所以要构建完整路由,以"/" 开头,不然会出现路由跳转时路由拼接问题,使用contactChildRouter 拼接完整路由,在后续递归菜单时使用
  • mountRouter 将所有菜单挂载在Layout子菜单下,Layout布局页面见下一章节
  • 数据说明
    • menuList: 构建菜单
    • routerList: 路由缓存,创建过程中会加载vue组件
    • menuArray: 构建完整路由后菜单的一维存储,便于后续菜单、路由搜索
import {
   defineStore} from 'pinia'

已下架不支持订阅

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不知所云,

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值