我们有vue-router的router.reload吗？

Question

我在这个拉动请求中看到:

• 添加router.reload()

  重新加载当前路径并再次调用数据挂钩

但是当我尝试从Vue组件发出以下命令时:

this.$router.reload()

我收到此错误:

router.reload()

我搜索了文档,但找不到任何相关内容.vue/vue-router提供者有这样的功能吗？

我感兴趣的软件版本是:

"vue": "^2.1.0",
"vue-router": "^2.0.3",

PS.我知道Uncaught TypeError: this.$router.reload is not a function是其中一个选择,但我正在寻找一个原生的Vue选项.

Answer 1

this.$router.go()这样做; 如果未指定参数,路由器将导航到当前位置,刷新页面.

至于"为什么会如此":go内部将其参数传递给window.history.go,因此它等于windows.history.go()- 根据MDN doc,它反过来重新加载页面.

_{注意:由于这会在常规桌面(非便携式)FF上执行"软"重新加载,如果您使用它,可能会出现一堆奇怪的怪癖,但事实上您需要真正的重新加载; 使用OP提到的window.location.reload(true);(https://developer.mozilla.org/en-US/docs/Web/API/Location/reload)可能有所帮助 - 它确实解决了我在FF上遇到的问题.}

Answer 2

最简单的解决方案是将:key属性添加到:

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

这是因为如果正在寻址相同的组件,Vue Router不会注意到任何变化.使用密钥,对路径的任何更改都将触发使用新数据重新加载组件.

Answer 3

我检查GitHub上的vue-router repo,似乎没有reload()方法了.但在同一个文件中有:currentRouteobject.

来源:vue-router/src/index.js
文档:docs

get currentRoute (): ?Route {
    return this.history && this.history.current
  }

现在您可以使用this.$router.go(this.$router.currentRoute)重载当前路线.

简单的例子.

这个答案的版本:

"vue": "^2.1.0",
"vue-router": "^2.1.1"

Answer 4

路由器.js

routes: [
{
  path: '/',
  component: test,
  meta: {
    reload: true,
  },
}]

主文件

import router from './router';

new Vue({
  render: h => h(App),
  router,
  watch:{
    '$route' (to) {
       if(to.currentRoute.meta.reload==true){window.location.reload()}
   }
 }).$mount('#app')

Answer 5

使用router.go(0)如果使用打字稿，并且它要求的参数为细末方法。

Answer 6

解析 URL 的路由并使用 Javascript 导航窗口。

        let r = this.$router.resolve({
        name: this.$route.name, // put your route information in
        params: this.$route.params, // put your route information in
        query: this.$route.query // put your route information in
      });
      window.location.assign(r.href)

此方法替换 URL 并使页面执行完整请求（刷新），而不是依赖 Vue.router。$router.go 对我来说不起作用，尽管理论上应该如此。

Answer 7

一个简单的例子：

this.$router.go(0)

这是文档： https: //router.vuejs.org/guide/essentials/navigation.html#traverse-history