VueJS Проблемы с маршрутизацией / навигацией - PullRequest
Новая
       8

VueJS Проблемы с маршрутизацией / навигацией

0 голосов
/ 16 ноября 2018

Возникли проблемы с использованием VueJS (при первом использовании)

  • У меня 90% шаблона страницы в файле index.html в корне документа
  • У меня 3 компонента (каждый из них содержит основное тело контента для каждой «страницы»)

Мой маршрутизатор: 

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 (я, вероятно, не понимаю, как / где Vue может использоваться там) - поэтому я использую стандартную ссылку, например <a class="nav-link" href="/gallery">Gallery</a>

Проблема:

Хотя весь этот код отлично работает на моей локальной машине, он нигде не работает, куда я загружаю свой код (я хотел бы, чтобы он работал на Netlify).Netlify и другие сайты перезаписывают мои попытки удалить хеш, поэтому мои ссылки затем ссылаются, например, на

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

1 Ответ

0 голосов
/ 16 ноября 2018

hash не является опцией Router. Попробуйте удалить это. Чтобы использовать режим истории в Netlify, вы должны добавить файл _redirects в каталог public. Добавьте это в файл:

/* / 200 Это гарантирует, что все пути обрабатываются vue-router

...