VueJS Routing/Navigation 个问题

Question

使用 VueJS 遇到问题（第一次使用）

我 90% 的页面模板都在 doc rootindex.html 文件中
我有 3 个组件（每个组件都包含每个 'page' 的主要内容正文）

我的路由器：

export default new Router({
  mode: 'history',
  hash: false,
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/gallery',
      name: 'Gallery',
      component: Gallery
    },
    {
      path: '/contact',
      name: 'Contact',
      component: Contact
    }
  ]
})

我无法让 <router-link :to="{ name: 'Gallery' }">Gallery</router-link> 工作 - 我的网站没有在我的 index.html 中将它们呈现为锚标记（我可能不理解 how/where Vue 可以在那里使用） - 所以我使用的是标准 link 例如<a class="nav-link" href="/gallery">Gallery</a>

问题：

虽然所有这些代码在我的本地机器上运行良好，但它在我将代码上传到的任何地方都不起作用（我想让它在 Netlify 上运行）。 Netlify 和其他站点覆盖了我删除哈希的尝试，所以我的 links 然后 link 到例如

https://examplesite.com/#/ => https://examplesite.com/gallery#/

Answer 1

hash 不是 Router 选项。尝试删除它。要在 Netlify 上使用历史模式，您必须将 _redirects 文件添加到 public 目录。将此添加到文件中：

/* / 200 这将确保所有路径都由 vue-router

处理

VueJS Routing/Navigation 个问题

VueJS Routing/Navigation issues

javascript

vue.js

vue-router

netlify