Para crear un nuevo registro, defino el objeto de registro dentro de la función de componentes data() y lo vinculo a campos de formulario usando v-model . Luego, este objeto se pasa a una acción de Vuex que publica el nuevo registro en el back-end y luego envía el objeto al mutador correspondiente.

El problema es que, cuando se realizan cambios en el objeto original definido en data(), parece que van en cascada al objeto que se envió a la tienda.

Entiendo el concepto de paso por referencia, pero parece que este patrón no debería verse afectado. ¿Hay un patrón mejor para usar al crear un nuevo registro de base de datos?

Añadir registro Vue

 <v-text-field v-model="newRecord.name" /> ... export default { data() { return { newRecord: {} } } } ... methods: { addRecord(){ this.addRecordAction(this.newRecord) ... this.newRecord.name = 'new name' // <== reflects in vuex store! } }

Tienda de discos Vuex

 async addRecordAction({commit}, newRecord){ const response = await axios.post('/api/record', newRecord) newRecord = response.data // contains record's new ID commit('addRecordMutation', newRecord) } ... addRecordMutation: (state, newRecord) => (state.records.push(newRecord))