VueJS Шаблон магазина с get & set

Question

У меня есть небольшой магазин (следуя шаблону состояния на VueJS (не VUEX)).

По сути, это выглядит так

export default {
    get selectedPartner() {
        return localStorage.getItem('selectedPartner');
    },

    set selectedPartner(item) {

        localStorage.setItem('selectedPartner', item);
    },


    clearFilters() {
        localStorage.removeItem('selectedPartner');
    }
}

В моем компоненте. vue Теперь я пытаюсь привязать его к нему следующим образом:

    data: function() {
      return {
        // Other stuff here...
        selectedPartner: filterStore.selectedPartner,
      }
    },

Теперь, когда он использует aws компонент, геттер на самом деле правильно вызывается. Когда я изменяю значение в компоненте, он не обновляет хранилище ...

Я понимаю, что делать это так (в localStorage) очень близко к VUEX. Но прежде чем перейти в VUEX, вы выбрали для этого подхода состояние gr asp в его наиболее простой форме.

Большое спасибо

Answer 1

Используйте computed вместо data:

computed: {
  selectedPartner: {
    get() { return filterStore.selectedPartner; },
    set(item) { filterStore.selectedPartner = item; }
  }
}