如何在散列模式下使用Vue路由器查询参数？ 在 hash 模式下从外部站点链接

如何解决如何在散列模式下使用Vue路由器查询参数？ 在 hash 模式下从外部站点链接

我想在 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.
*/
})

解决方法

您显示的用于记录查询参数的代码是正确的，因此路由存在问题。要在模板中创建链接，请使用 <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 中使用散列，否则查询将无法正确注册。查询必须跟在散列之后，但如果不使用散列，则会放在它前面。