我们在 vue-router 中有 router.reload 吗？

javascript node.js reload vue.js vue-router

2022-08-30 02:23:19

我在这个拉取请求中看到：

添加router.reload()

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

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

this.$router.reload()

我收到此错误：

Uncaught TypeError: this.$router.reload is not a function

我在文档中搜索，但找不到任何相关内容。vue/vue-router provider 是否提供一些这样的功能？

我感兴趣的软件版本是：

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

PS.我知道这是替代方案之一，但我正在寻找一个原生的Vue选项。location.reload()

答案 1

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

注意：路由器及其历史组件的当前实现不会将参数标记为可选，但IMVHO它要么是Evan You的错误，要么是遗漏，因为规范明确允许它。我已经提交了一份关于它的问题报告。如果您真的关心当前的 TS 注释，只需使用等效的this.$router.go(0)

至于“为什么会这样”：内部将其参数传递给，因此它等于 - 反过来，根据MDN文档，这会重新加载页面。gowindow.history.gowindows.history.go()

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

答案 2

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

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

这是因为如果对同一组件进行寻址，Vue 路由器不会注意到任何变化。使用键，对路径的任何更改都将触发使用新数据重新加载组件。