最近开发遇到这样一种情景,某个页面需要根据路由query查询参变化执行对应的操作,放在生命周期钩子函数里面都不太合适,因为生命周期钩子函数是针对组件的不是针对页面的,所以需要通过watch监听路由query查询参的变化,代码如下:
watch: {
'$route.query': {
if (this.$route.query.xx) {
//根据xx参数值的情况,执行对应的操作....
}
},
deep: true
}
如果我们需要同时监听Vuex中某两个变量的变化,来判断是否需要执行某些操作
,可以这样写
computed: {
storeState() {
const {a, b} = this.$store.state
return {
a,
b
}
}
},
watch: {
storeState: {
handler: function (val, newVal) {
//handler...
}
}
监听路由与状态变化
本文介绍如何使用Vue的watch监听路由query参数变化及Vuex中多个状态变量变化的方法,实现页面响应式更新。
858

被折叠的 条评论
为什么被折叠?



