Блог

Главная - Вопросы по программированию - Nuxt — как сохранить состояние хранилища при возврате обратно в root (домашняя страница)

Nuxt — как сохранить состояние хранилища при возврате обратно в root (домашняя страница)

#vue.js #vuex #nuxt.js

#vue.js #vuex #nuxt.js

Вопрос:

В проекте Nuxt у меня есть несколько анимаций на домашней странице, и я не хочу, чтобы они запускались второй раз, когда пользователь возвращается на домашнюю страницу, например, со страницы About

Итак, у меня есть переменная в хранилище -> index.js

 export const state = () => ({
  isVisited: false
})

и в index.vue, если значение isVisited равно false, запустите анимации и установите переменной значение true

     if (this.$store.state.isVisited == false) {
      this.initialAnimation();
      this.$store.state.isVisited = true
    }

Когда я захожу на страницу About, значение isVisited равно true, так что это работает, но когда я возвращаюсь обратно в / (домашняя страница), значение isVisited возвращается к false, и анимации запускаются снова. Хорошо, это логично, хранилище сбрасывает его самостоятельно при перезагрузке страницы в root, но у меня нет идей, как решить эту проблему по-другому.

Еще одна идея, которая у меня была, заключалась в том, чтобы определить, переходит ли пользователь со страницы / about, а затем отключить анимацию, но проблема в том, что пользователь может сначала перейти на страницу about, и он никогда не увидит начальную домашнюю анимацию, а мы этого не хотим.

Я новичок в хранении / vuex, и я еще не совсем понимаю это, поэтому извините, если вопрос глупый

Комментарии:

1. хранилище сбрасывает себя при перезагрузке на любой странице. Например. когда вы загружаете страницу с сервера, а не при навигации в приложении.

2. @Aldarund спасибо. Да, когда я перемещаюсь по App Store, все в порядке, только когда я возвращаюсь в «/», хранилище сбрасывается само. Вы понимаете, что я делаю не так?

3. Как вы возвращаетесь в / ? Вы должны использовать nuxt-link для перехода в / и тогда она не будет потеряна, пока пользователь не нажмет фактическую кнопку перезагрузки страницы

4. Если вы напрямую переходите к ‘/’ из браузера, то это запрос на стороне сервера. таким образом, ваше хранилище vuex не будет сохраняться.

5. @Aldarund да, nuxt-link — это решение. Я использовал router-link в чистом vue, но я почему-то полностью пропустил nuxt-link в Nuxt. Спасибо