Получить неизменяемые данные из vuex в рендерить в компоненте?

Question

[movsumlu]

добрый день!
такой вопрос: получаю из vuex.store одно значение, которое рендериться в двух разных компанентах,
но надо сделать так чтобы при нижнее число изменялось, при увеличении/уменьшении при помощи контроллера,
а верхнее оставалось таким же и не перерендеровалилось?
значение получаю с помощью getter, и вычисляю computed методах

Answer 1

[Алексей Ярков]

<span v-once>{{ data }}</span>
При изменении data отображаться будет начальное значение.

Answer 2

[0xD34F]

Вместо computed сделайте обычное свойство компонента, при создании экземпляра копируйте значение из стора:

data() {
  return {
    value: this.$store.state.value,
  };
},

Answer 3

[Andrey Vasilev]

ты ссылаешься на один и тот же массив/объект. когда его получаешь, то используй оператор spread '...' чтобы получить абсолюнто новый объект/массив и работать с ним.
к примеру получил ты свой object, тогда пишешь this.counter = {...object} или this.counter = [...array].
После чего, измения this.counter никак не будут влиять на данные, полученные из хранилища
гуид

Comments

[movsumlu]

спасибо большое за ответ, можно небольшое уточнение, немного не понят в какой именно момент использовать spread-оператор, вот я получаю этот параметр и ипользую уже в другом computed:

computed: {
...mapGetters({
counter: "spot/orderCounter"
})
}

[Andrey Vasilev]

IgorBydanov, вот в другом computed конкретно его и переопредели, если вот только именно там нужно.
то есть у тебя геттер будет отдавать новые значения, а в другом компутед ты проверишь наличие записанной переменной this.counter, к примеру. если в this.counter пусто, то соответсвенно юзаешь спред. главное это сделать один раз, иначе значение будет перезаписываться, но не ссылаться.