vue路由器链接上的磅符号

【问题标题】：Pound sign on vue router linksvue路由器链接上的磅符号
【发布时间】：2019-01-14 00:53:22
【问题描述】：

您好，如何在 vue 中删除路由器链接中的井号。我总是在每个链接中得到一个井号，例如：http://localhost:8080/#/

export default new Router({
  routes: [
    {
      path: '/',
      name: 'SplashScreen',
      component: SplashScreen
    },
    {
      path: '/aboutus',
      name: 'AboutUs',
      component: AboutUs
    },
    {
      path: '/aboutus',
      name: 'Dashboard',
      component: Dashboard
    }
  ]
})

【问题讨论】：

这是正常行为，这是 SPA（单页应用程序）的工作方式。 “井号”表示链接不会将应用程序移动到其他页面。
有没有办法去掉？
如果我在上面放一个API请求会不会影响
你的 api url 示例是什么？
How to remove hashbang from url?的可能重复

标签： vue.js

【解决方案1】：

使用模式为history

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

还需要服务器配置Apache

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

查看更多详情here

【讨论】：

值得注意的是，这需要服务器端配置才能正常工作
我知道，但有时人们不关注答案中的链接 ;-)
谢谢。我已经在 heroku 上部署了我的 vuejs 应用程序，后来将模式更改为历史记录，这样我就可以摆脱井号，但我不确定如何在 heroku 上覆盖这个服务器设置。该文档建议使用 .htaccess 或 apache_app.conf 但这些都不起作用，当重定向到其他页面时我仍然得到 404。向正确方向轻推将受到高度赞赏