element 菜单修复02-王荣荣如此唯美

这一节我们会学到排他思想,就是以前按钮的功能

比如有n 个按钮,点哪个哪个背景色发生变化,

2, 当我们下次再进来的时候,上次选中的按钮,要保持状态,

这类问题,在vue 中,仅仅需要一个状态标记结合 localStorage 就搞定了!

https://gitee.com/mzzy8/app/commit/e8473aaa0b8379b778ec56f895ba68945cf8d18e

我们自己照着写下就行了

default-active 默认激活的是哪个选项,他会和下面的子菜单中 index的值比较,若相当则属于激活状态!

我们一般把 index 设置为path属性的值,方便后续添加路由功能

——————————————————————————————

el-menu 有自动给二级菜单添加路由的功能,其中路由地址就是Index的值

1,开启路由功能:

2, 写子路由

3,路由清单中配置一下:

4, 路由出口:

他是admin.vue 的子路由,这就是路由嵌套很简单,我们看下显示页面:

这样的话,基本架构我们就搭建起来,左侧是菜单,右侧是内容,

可以自由切换显示页面!

以后就可以在内容中填充了

 

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值