Vue.js 变异vuex存储外部处理程序问题

我创建了一个从状态获取值并返回不同值的getter

 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."

---

我不确定是什么原因造成的，因为我使用的是getter not state

您正在变异变异处理程序外部的状态嵌套属性（fs.data[key][“Risk bucket”]=…）。一个选项是通过克隆将对象与状态分离。例如

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;
  }

---

可能发生在州数据被操纵的时候。您是否可以尝试先在getter中创建状态数据的副本（扩展运算符），然后进行更改。