I have a Vuex store action that needs to interact with the API using new data for updating purposes.
My goal is to create a separate object that mirrors an existing value in the store, allowing me to manipulate it without affecting reactivity.
However, when I attempt to use Array.push()
, I encounter the following error:
Do not change vuex store state outside of mutation handlers
Is there a different approach I should take?
(Possibly related to my getter on
rootState.phone.policy.currentPolicy.attributes.insured.phones
which might be causing this issue).
async [PolicyActionTypes.UPDATE_POLICY](
{ rootState },
payload: UpdatePolicyPayload
) {
const newPolicy: Policy = {
...rootState.phone.policy.currentPolicy,
};
const newPhone: Phone = {
imei: '123',
brand: 'Samsung',
};
newPolicy.attributes.insured.phones.push(newPhone);
// Simulated asynchronous API call
api.updatePolicy(newPolicy)
},