防止 VueJs 中浏览器 url 的位置更改 [英] Prevent location change in browser url in VueJs

问题描述

我有一个 vuejs 应用程序，我在其中对后端进行了 rest api 调用.我已经定义了路由器并浏览了不同的组件.现在，当我导航时，我看到了 https://domain-name.com/#/abc浏览器 URL 中的路由路径.我想阻止这种情况，以便它始终显示 https://domain-name.com/我走过的路.有没有办法在 Vuejs 或任何其他解决方案中做到这一点.感谢您的帮助！

I have a vuejs application where i make rest api calls to the backend. I have define the router and navigate the different components. Now as I navigate i see the https://domain-name.com/#/abc the route path in the browser URL. I want to prevent this so that it always show https://domain-name.com/ irrespective of what path i traverse. Is there a way to do it in Vuejs or any other solution. Appreciate you help!

谢谢，拉胡尔

推荐答案

您正在使用 Vue Router，它改变路由的想法...

You're using Vue Router, the idea of it to change routes...

由于您在路由器下的 url 中获得了哈希值，因此您需要添加 mode 属性.

Since you've got the Hash in the url under your router you'll need to add mode attribute.

const router = new VueRouter({
  mode: 'history',
  routes: [...]
})

这将删除/#/someRoute 并变成/someRoute

This will remove the /#/someRoute and it will become /someRoute

一旦添加了历史模式，您需要分别设置您的 apache/nginx 服务器以反映用户是否输入 domain.com/someRoute 他们将不会收到我们可以修复的任何内容 这里.

Once adding history mode, you'll need to setup your apache/nginx server up respectively to reflect if the user was to type in domain.com/someRoute they would receive nothing which we can fix here.

如果您希望链接永久保留为 www.domain.com 而不是使用 vue-router，则必须在需要时更改组件，它们基本上在页面上有一百万零一个 if 语句.

If you want the link to permanently stay as www.domain.com instead of using vue-router, you'll have to change components as and when you need them essentially having a million and one if statements on the page.

这篇关于防止 VueJs 中浏览器 url 的位置更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！