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

vue刷新当前页面重新传递参数vue刷新当前页面重新传递参数在vue中碰到了需要刷新当前页面并传递重新params参数的需求。我们可以进入空白页再在空白页跳转回到上一个页面实现需求首先在空白页写上路由守卫beforeRouteEnter,在beforeRouteEnter中获取到上一个路由,直接跳转回去//空白页面exportdefault{beforeRouteEnter(to,from,next){next((xq)=>{//要注意,必须使用this.$router.repla

大家好,欢迎来到IT知识分享网。

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

免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://yundeesoft.com/11043.html

(0)
上一篇 2024-03-26 15:00
下一篇 2024-03-26 20:00

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

关注微信