原文链接
在项目中通过命名视图在很多个页面行都设置了头部组件,在项目中就遇到了这么一个问题,这个头部只会加载一次,事实上虽然头部会公用,但是不是所有的头部都一样的,有些页面的头部需要做一些多余的功能,该怎么搞
在mounted中定义方法是没用的,因为头部只会加载一次,这时我们就可以通过监控路由,路由变化了,就会执行函数,就可以实现不同页面显示不同的头部了。
watch: {
'$route': 'judgeHelp'
},
methods: {
// 判断help页面显示与否
judgeHelp () {
let router = this.$route.path
console.log(router)
// 获取到路由后可以在这里做相关判断
},
}
由此就可以实现不同页面的不同显示了。
这样还有一个问题,刷新页面,函数就不会执行了,因为路由没变化,这时我们在mounted中再执行一遍函数就可以了。
mounted () {
this.judgeHelp()
}