Mutating vuex store за пределами обработчиков

Question

Я создал метод получения, который принимает значение из состояния и возвращает другое значение.

 secondCoverageSSData: state => {
    const fs = state.secondCoverageSS;
    Object.keys(fs.data).forEach(key => {
      fs.data[key]["Risk buckets"] = `(${fs.data[key]["Risk buckets"].right -
        fs.data[key]["Risk buckets"].length}, ${
        fs.data[key]["Risk buckets"].right
      }]`;
    });
    return fs.data;
  }

Однако я получаю следующую ошибку:

Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] do not mutate vuex store state outside mutation handlers."

Я не уверен, что вызывает это как я использую геттер, а не состояние.

Answer 1

вы изменяете вложенные свойства состояния (fs.data [ключ] ["корзины риска"] = ...) вне обработчиков мутации. один из вариантов - отсоединить объект от состояния путем его клонирования. Например

import { cloneDeep } from 'lodash'

 secondCoverageSSData: state => {
    const fs = cloneDeep(state.secondCoverageSS)
    Object.keys(fs.data).forEach(key => {
      fs.data[key]["Risk buckets"] = `(${fs.data[key]["Risk buckets"].right -
        fs.data[key]["Risk buckets"].length}, ${
        fs.data[key]["Risk buckets"].right
      }]`;
    });
    return fs.data;
  }