关于vue如何监听route和state以及各自对应的实际场景
一、监听route
场景:监听浏览器地址栏分页参数的变化
// 注意 newPageNum和 oldPageNum是 string类型
'$route.query.pageNum'(newPageNum, oldPageNum) {
if (newPageNum !== oldPageNum && newPageNum !== this.pageNum.toString()) {
this.handleCurrentChange(parseInt(newPageNum) || 1);
}
},
'$route.query.pageSize'(newPageSize, oldPageSize) {
if (newPageSize !== oldPageSize && newPageSize !== this.pageSize.toString()) {
this.handleSizeChange(parseInt(newPageSize) || 20);
}
}
二、监听state
场景:监听菜单栏的折叠与展开的状态
watch: {
'$store.state.isCollapse'(newVal, oldV) {
this.isCollapse = newVal
}
},