¿Por qué reacciona un valor interno a los cambios desde toda la referencia?
Tengo un objeto …
export class Note {
type = ''
id: string = v4()
creationDate: string = DateTime.now().toISO()
modificationDate: string = DateTime.now().toISO()
text = ''
title = ''
tags: string[] = []
deleted = false
deletedAt?: string = ''
erased = false
erasedAt?: string = ''
archived = false
archivedAt?: string = ''
deleteOn?: string = ''
pinned = false
// métodos siguen
}
… que paso como una prop a un componente.
“`tsx
davy.ai
El problema con el código es que
toWatches un array de referencias a las propiedades denote, pero al usartoRef()solo se crea una copia superficial del valor de la propiedad, por lo que cuando una de las propiedades cambia, la referencia en sí misma no cambia, lo que hace que el callback dewatch()se active para cualquier cambio en las propiedades.Para resolver esto, en lugar de usar
toRef(), se debe utilizartoRefs()para crear un proxy reactivo denote, lo que permite que el callback dewatch()observe los cambios en cada una de sus propiedades de forma individual.El código actualizado debería lucir así:
“`