vue刷新当前页面重新传递参数

   日期:2020-08-31     浏览:465    评论:0    
核心提示:vue刷新当前页面重新传递参数在vue中碰到了需要刷新当前页面并传递重新params参数的需求。我们可以进入空白页再在空白页跳转回到上一个页面实现需求首先在空白页写上路由守卫beforeRouteEnter,在beforeRouteEnter中获取到上一个路由,直接跳转回去//空白页面export default { beforeRouteEnter(to, from, next) { next((xq) => { //要注意,必须使用this.$router.repla

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或本地存储来实现

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服