vue刷新当前页面重新传递参数
在vue中碰到了需要刷新当前页面并传递重新params参数的需求。
我们可以进入空白页再在空白页跳转回到上一个页面实现需求
首先在空白页写上路由守卫beforeRouteEnter,在beforeRouteEnter中获取到上一个路由,直接跳转回去
//空白页面
export default {
beforeRouteEnter(to, from, next) {
next((xq) => {
//要注意,必须使用this.$router.replace而非this.$router.push
//如果使用的是this.$router.push会导致,进入过空白页之后,通过浏览器的后退键,无法实现页面后退的bug现象
xq.$router.replace(from.path);
});
},
};
在需要刷新的页面中通过this.$router.replace跳转到空白页
clk(id) {
//把要传递的参数存放在vuex或者本地存储中
this.$store.dispatch("ADDIDS",id)
this.$router.replace({
path: "/refresh",
});
},
最后在params传递的参数中写上
params: {
iid: id || this.$store.state.id,
}
页面回退并传递参数也可以使用vuex或本地存储来实现