Vue / Vuex - сохранить значение записывает ноль в mount () после обновления окна sh - но после изменения компонента записывает правильное значение - PullRequest
Новая
       36

Vue / Vuex - сохранить значение записывает ноль в mount () после обновления окна sh - но после изменения компонента записывает правильное значение

0 голосов
/ 26 марта 2020

У меня есть переменная price, которая инициализируется как ноль в состоянии / хранилище. 

Vue.use(Vuex);
export default new Vuex.Store({
  state: {
    filters: { price: 0 },
    ...
  }

И используется в ползунке диапазона ввода в нижеуказанном компоненте. Я новичок в Vue / x и пытаюсь понять, где и когда менять данные. Допустим, я установил price на 400 с помощью ползунка цены, и мутация правильно сохраняет его в магазине как 400, если я переименую sh страницу, она будет отображаться как 0, но если я внесу изменение в компонент в моей IDE и он перемонтируется, затем он регистрирует 400. Я попытался назначить this.price в updated () безуспешно. В качестве функции в computed я получу ошибку «no setter». (Я новичок в Vue) 

<template>
  <input v-model.number="price" type="number" />
  <input @input="handleSlide" @change="setPrice(price)" type="range"/>
</template>
export default {
  name: "price-range-slider",
  computed: mapState(["filters"]),
  data() {
    return {
      price: 0
    };
  },
  mounted() {
    this.price = this.filters.price;
    console.log(this.price); // displays 0 after page refresh, but correct value when component remounts from change.
  },
  methods: {
    setPrice(price) {
      state.commit("setPrice", price);
    }
  }
};
...