Redux – Error: A state mutation was detected between dispatches while creating new widget

One common error which caused this error for me was, when I was cloning into state from props.

getFields(props) {
  return ((props.resources.fields && [...props.resources.fields]) || []).map(
    field => {
      field.checked = false;
      return field;
    }
  );
}

this.setState({ fields: getFields(props) });

In the above example fields was an array of object. And instead of doing a deep copy, i did a shallow copy with [...props.resources.fields].

Doing a deep copy would solve this issue. So, for my case i did one more level of shallow copy as follows:

getFields(props) {
  return ((props.resources.fields && [...props.resources.fields]) || []).map(
    item => {
      const field = { ...item };
      field.checked = false;
      return field;
    }
  );
}

You might have to do a deep copy using JSON.parse(JSON.strigify(props.resources.fields)).

Hope this helps.