nuxt. js. режим: спа. проблема в не root пути на производстве - PullRequest
2 голосов
/ 27 января 2020

Я японец, не очень хорошо владею английским sh извините.

У меня есть такой текстовый проект.

Режим спа.

Построение каталога

pages - index.vue
        index
          |_ child.vue
          |_ index.vue

страниц / индекс. vue

<template>
  <div>
    {{ title }}
    <router-view />
  </div>
</template>

<script>
export default {
  computed: {
    title () {
      let title = ''
      if (this.$route.path === '/') {
        title = 'Parent'
      } else if (this.$route.path === '/child') {
        title = 'Child'
      }
      return title
    }
  }
}
</script>

Когда я строю (или генерирую), вы можете получить stati c файл child / index. html.

Я загружаю внутри dist на сервер.

Но если я получу доступ к http://deployedrootpath/child, вычисленное свойство не будет работать.

Я думаю, это происходит потому, что эти stati c файлы создаются перед созданием hook.

Он может знать только возвращаемое значение из ловушки asyncData.

Так я и сделал.

middleware / redirect. js

export default function ({ route, redirect }) {
  if (route.path === '/child/') {
    // I need to set some params because of navigation duplication error of vue-router.
    redirect('/child', { params: { 'redirect': true } })
  }
}

страниц / индекс / ребенок. vue

<template>
  <div>
    child
  </div>
</template>

<script>
export default {
 middleware: 'redirect'
}
</script>

На самом деле это сработало, но я знаю, что это ужасный способ.

И даже если нет другого способа, кроме этого, я хочу хотя бы скрыть параметры от перенаправленного URL.

Пожалуйста, помогите мне.

1 Ответ

1 голос
/ 27 января 2020

Я решил.

nuxt.config. js

trailingSlash: true

Это делает путь к файлам stati c и $ route.path одинаковыми.

https://nuxtjs.org/api/configuration-router/#trailingslash

...