vue-element-admin模板刷新组件,初始化页面

情景:一个后台系统用的是vue-element-admin模板搭建的;遇到一个需求,虽是同一个页面但他是由很多个产品控制的,切换产品的时候要清空上一个产品选择过的参数,初始化页面(假设需要初始化的参数有很多)。
(1)第一个办法是监控产品的变化,变化的时候把相应参数设成初始值,该清掉清掉该置空的置空,但是涉及到的页面有很多,每个页面都需要做如此的处理,那么就想能不能做个统一的处理,每个页面都适用
(2)

vue-element-admin 中大部分页面都是基于这个 layout 创建的,appMain.vue相当于是主体区域,那么我们在这个页面中监控产品的变化,如果变化了就更新当前页面就能达到想要的效果了
在这里插入图片描述
看一下上一开始是根据路由的变化进行更新的,那么现在我们可以加一个产品的变化,除此之外扩展一个如果产品变化的时候当前页面处于二级页面那么要跳回他的一级页面,看一下watch里面的写法,同时二级页面的路由上也要做调整例如:

{
	path:'child',
	name:Child,
	component:()=>import('@/views/child)
	meta:{father:'Father'},		// 主要是加上这句,注意Father是父级路由页面的name,不是path
	hidden:true
}

注意:如果在appMain.vue这个页面监控了产品的变化,如果你不在这个页面处理二级页面到一级页面的跳转的话,假如你去各自单独的二级页面去监听产品的变化然后跳转跳转到各自的父级页面的话,是不可行的 在appMain.vue这个页面监听到产品变化会先进行更新,而不会走自己页面监听跳转的逻辑了,所以统一都在appMain.vue这个页面处理监听和跳转。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值