[Vuejs]-Vuex mutation error when pass Object (with objects) to component

1👍

Basically only 2 options:

  1. Pass a deepcopy of the object to props;
  2. Use @input event or v-model with computed props (Like in pkawiak’s answer https://stackoverflow.com/a/39249362/930170);

I prefer to use deepcopy while I’m sure that object isn’t too big. This approach helps to keep code more clean, and much more easier for maintenance.

Second approach only for cases when expected object is bloody-big

1👍

Take a look at Vuex form handling docs. It encourages using @input event or v-model with computed props…

Assuming obj is a computed property that returns an Object from the store, the v-model here will attempt to directly mutate obj.message when the user types in the input. In strict mode, this will result in an error because the mutation is not performed inside an explicit Vuex mutation handler.

Leave a comment