Изменение значения получателя с использованием значения состояния в Vuex

Question

У меня есть этот геттер, который получает значение одного элемента в состоянии:

boxdata: state => {
      return state.boxchart.data
    },

Теперь у меня есть другой элемент в состоянии, который я использую для изменения значения геттера

В настоящее время Я делаю это, когда компонент монтируется, но кажется, что данные иногда загружаются, а иногда нет:

computed: {
      ...mapGetters(["boxdata"]),
      ...mapState(['reference_fc'])
    },

mounted() {
 this.boxdata[0].chartOptions.series[0].data[0]=this.reference_fc.NSR.values
}

Поэтому мне интересно, как я могу убедиться, что средство получения boxdata уже обновлено в первый раз, когда компонент грузы?

Answer 1

Vue не может обнаружить назначения элементов массива. Это объясняется в Предостережениях .

Попробуйте вместо этого:

this.$set(this.boxdata[0].chartOptions.series[0].data, 0, this.reference_fc.NSR.values)

Answer 2

Вы не должны изменять данные, используя геттеры. Вы должны использовать мутации .

Методы получения должны только получать производное состояние на основе состояния хранилища. см. Здесь

В вашем магазине:

mutations: {
  setBoxdata(state, value) {
     state.boxchart.data[0].chartOptions.series[0].data[0] = value;
  }
}

В вашем компоненте:

computed: {
  ...mapMutations("setBoxdata")
},
mounted() {
  this.setBoxData(this.reference_fc.NSR.values);
}