Сохранение данных в глобальном хранилище vuejs2 - PullRequest
Новая
       28

Сохранение данных в глобальном хранилище vuejs2

0 голосов
/ 20 сентября 2018

Мне был нужен «полуглобальный» магазин, где мой дочерний компонент открывает магазин, и его дочерний компонент также может получить к нему доступ.Мне не нужен был vuex, потому что мне не нужен был единственный источник правды по всему миру.Я хотел поместить свой полуглобальный магазин в компонент и его дочерние элементы, которые открывают / импортируют его.Я использую отдельные файловые компоненты.

Мой магазин определен в js-файле, как показано ниже: 

export const store = {
  state: {
    checkedSymbols: []
  },
  updateCheckedSymbols (symbol) {
    const index = this.state.checkedSymbols.indexOf(symbol)
    if (index === -1) {
      this.state.checkedSymbols.push(symbol)
    } else {
      this.state.checkedSymbols.splice(index, 1)
    }
    console.log('updated symbols array: ', this.state.checkedSymbols)
  },
  destoryStore () {  // using this to manually destroy/reset my store
    this.state.checkedSymbols = []
    console.log('store destroyed')
  }
}

У меня есть дочернее представление, где оно открывает модальное окно, в этом модальном яесть несколько других детских взглядов.В этом моде, когда мне нужно получить доступ к этому магазину, я импортирую магазин, чтобы получить к нему доступ.Он реактивен и работает отлично, но я не думаю, что понимаю, как работает этот глобальный магазин.

Когда пользователь закрывает мой модал, он у меня так, что он уничтожается, так что если пользователь открываетснова модально, он перерисовывает все.И я чувствовал, что если компоненты «перерисовываются», данные также обновляются до начальной точки.Я проверил это, и мое восприятие кажется правильным.

Но мой магазин остается с прежними значениями.Почему это сохраняется?Возможно, я не правильно использую эту концепцию глобального магазина.Сейчас я вручную уничтожаю его в уничтоженном хуке, но мне было любопытно, почему он сохраняется, даже если компоненты, которые импортировали хранилище, уничтожены и повторно обработаны.

Я создал свое простое глобальное хранилище, следуя этой статье.: https://medium.com/fullstackio/managing-state-in-vue-js-23a0352b1c87

Спасибо за ваше время и помощь!

...