Многоязычность - префикс всех маршрутов и выбор этого параметра при загрузке страницы? - PullRequest
Новая
       5

Многоязычность - префикс всех маршрутов и выбор этого параметра при загрузке страницы?

0 голосов
/ 24 октября 2018

Я пытаюсь поставить перед всеми маршрутами префикс языка, например example.com/en/site.При изменении языка просто перенаправьте, например, на example.com/fr/site.

В моем корневом экземпляре у меня есть это: 

export const app = new Vue({
  router,
  data: {
    lang: 'en',
    home: getData.home,
  },
  watch: {
    lang() {
      getData.startAPI();
    },
  },
render: h => h(App)
})

На данный момент, когда посетитель выбирает другойЯзык, по щелчку я изменяю свойство $ root.lang, которое отслеживается, а затем вызывает метод startAPI (), который показывает загрузочный счетчик при получении новых данных.URL остается example.com.Теперь я хочу, чтобы мой URL был example.com/en для английского и example.com/fr для французского.Доступ к example.com/ должен быть перенаправлен на /en/.

Я пробовал это в моем router.js: 

export default new Router({
  mode: 'history',
  routes: [
   {
     path: '/:lang',
     children: [
       {
         path: '',
         component: () => import('./views/Home.vue'),
       }
       etc.
     ]
   },

Переход на example.com/en мой дочерний компонентне будет оказано.

Я также попробовал это: 

export default new Router({
  mode: 'history',
  routes: [
   {
     path: '/:lang/',
     component: () => import('./views/Home.vue),
   },
   {
     path: '/:lang/about',
     component: () => import('./views/About.vue),
   },

Теперь я могу получить доступ к example.com/en/, а также example.com/en/about.Проблема, с которой я столкнулся, заключается в том, что я не могу получить доступ к свойству $ route.params.lang при начальной загрузке страницы, чтобы загрузить нужные данные, если кто-то напрямую перейдет на example.com/fr или example.com/en.*1016.*

Зачем мне языковые префиксы?Я использую prerender-spa-plugin, и я хотел бы создавать HTML-файлы для каждого маршрута на обоих языках для SEO целей.Если у вас есть идея получше, дайте мне знать!Я также думал о том, чтобы использовать 2 отдельных приложения для веб-интерфейса и запустить приложение на дополнительном языке на поддомене.

Любая помощь будет высоко оценена, если вам нужна дополнительная информация, дайте мне знать.ура!

Редактировать: В моем App.vue у меня есть состояние "isLoaded: false", которое становится истинным после загрузки данных API.My рендерится v-if = "isLoaded".Наверное, поэтому я не могу получить доступ к параметру при загрузке страницы.

...