vue解决同一页面跳转页面不更新

产品的需求：跳转下一个同状态的详情页

方案①：

// 这种是最简单的方法

<router-view :key="$router.currentRoute.fullPath"/>

<!-- 或者下面这个，$route是当前正在跳转的路由 -->

<router-view :key="$route.path"/>

方案②：

// 监控data中的数据变化

watch: {

  $route(to, from) {

    if (this.$route.query.proId) {

      console.info( "重新调用接口获取页面数据" )

    }

  }

}

方案③：

// 通过beforeRouteUpdate获取路由变化

beforeRouteUpdate(to, from, next) {

　　//  判断是否为当前路由跳转

    if (from.path === '/task/Maintain/detail/Com') {

      this.$nextTick(() => {

　　//  此时路由参数已经变化，重新调用接口获取数据

        this.gethistoryList(this.$route.query.proId)

      })

    }

    next()

  }