vue 页面返回 重新获取数据

1、方法一：Vue利用visibilitychange监听页面显示和隐藏 

mounted() {

　　document.addEventListener(' visibilitychange', _this.handleVisiable)

},

destroyed() {

　　document.removeEventListener('visibilitychange', _this.handleVisiable)

},

methods: {

  handleVisiable(e) {

    if (e.target. visibilityState === 'visible') {

    // 要执行的方法

    }

 }

}

ps：记得清除监听

 

参考地址： https://blog.csdn.net/qq_29180565/article/details/110651535

 

2、方法二:router的meta 添加变量 isBack 

routes: [
    {
      path: '/reply',
      name: 'Reply',
      component: Reply,
      meta: {
        title: 'reply',
        keepAlive: true,
        isBack: false
      }
    },
]

vue 页面获取变量

beforeRouteEnter(to, from, next) {
    if (from.name == 'ReplyDetail') { // 这个name是下一级页面的路由name
        to.meta.isBack = true; // 设置为true说明你是返回到这个页面，而不是通过跳转从其他页面进入到这个页面
    }
    next()
},

activated() {
    if (this.$route.meta.isBack) {
       // 页面返回之后的处理
    }
    this.$route.meta.isBack = false //请求完后进行初始化
},