Así que estoy aprendiendo vue 3 con la API de composición y quiero cambiar la propiedad .value de una variable 'filteredProjects' de la respuesta de axios así...
const filteredProjects = ref(null)
onMounted(async () => {
await api.get("/project").then(response => filteredProjects.value = response.data);
})
console.log(filteredProjects.value)
Probé console.log(filteredProjects.value) pero devolvió un valor nulo, así que revisé la variable sin la propiedad .value console.log(filteredProjects) y descubrí que los datos de respuesta de la API se están configurando en la propiedad _value en lugar de . valor. Este es el resultado de la consola.
RefImpl {__v_isShallow: false, dep: undefined, __v_isRef: true, _rawValue: null, _value: null}
dep: Set(1) {ReactiveEffect}
__v_isRef: true
__v_isShallow: false
_rawValue: {data: Array(13), message: 'successfully get data'}
_value: Proxy {data: Array(13), message: 'successfully get data'}
value: (...)
[[Prototype]]: Object
En Vue.js, cuando utilizas una variable reactiva, como las creadas con ref o reactive, la biblioteca agrega una propiedad adicional llamada _value a la variable reactiva. Esto se hace para evitar conflictos con el propio nombre "value" y para garantizar que la variable sea reactiva correctamente.