如何在哈希模式下使用Vue路由器查询参数？

Question

我想访问Vue方法中的URL，而不是使用window.location.href和解析。

路由器/index.js

const router = new Router({
  mode: 'hash',
  routes: []
});

router.beforeEach((to, from, next) => {
/*
*WOULD LIKE TO ACCESS THE URL PARAMS HERE*
**to.query** is not working in hash mode.
*/
})

Answer 1

您为记录查询参数所显示的代码是正确的，因此路由存在问题。若要在模板中创建链接，请使用<router-link>

<router-link to="/myroute?id=5"></router-link>

若要在脚本中以编程方式路由，请使用this.$router.push (或this.$router.replace)：

this.$router.push('/myroute?id=5');

当您记录to.query时，您应该看到：

{ id: "5" }

编辑：您显示(在评论中)您正在链接到该应用程序外部。

以hash模式从外部站点链接

http://localhost/#/?id=5

当以散列模式从外部链接到站点时，您必须使用url中的散列，否则查询将无法正确注册。查询必须跟随哈希，但如果不使用哈希，查询将放在前面。