En este post de programación con el framework Vue o Vue.js te mostraré cómo acceder a data
cuando regresamos los datos o el objeto data de nuestro componente.
Esto es necesario porque en ocasiones necesitamos acceder a los datos de Vue desde la definición.
Al final esto no tiene tanto que ver con Vue.js, sino con JavaScript. Pero incluso así en ocasiones podemos olvidar lo que sucede con los objetos anónimos.
La sintaxis corta que vemos en varios lugares es:
Ya que es una función que va a regresar un objeto. Lo encerramos entre paréntesis para que no se confunda con el cuerpo de la función.
El problema está en que no vamos a poder acceder a los datos desde ese objeto, por ejemplo, al imprimir lo de la línea 4 vamos a tener un undefined
:
Ya que this no tiene los datos en el momento de definir la data de nuestro componente.
Así que la solución es definir el objeto dentro de la función, ya no solo regresarlo. Lo definimos, y al final lo regresamos.
Pero dentro del objeto vamos a poder acceder a las propiedades del mismo en tiempo de definición:
Estamos definiendo el objeto en la línea 2. Dentro de este objeto podemos acceder a sí mismo como se observa en la línea 5.
Al final de la función devolvemos el objeto. Y de este modo podemos acceder a la data de Vue desde la definición de la misma.
Si te lo preguntas, a mí me sirvió al estar trabajando con validación de formularios usando Vuetify, ya que al definir las reglas debía comprobar si había una propiedad en true
:
Lo que te comento está en la línea 6. Para terminar te dejo con más tutoriales de Vue.
En mi blog te he enseñado a usar youtube-dl para descargar vídeos con permiso del…
Siguiendo con los tutoriales que consumen la API de los Bots de Telegram con cURL…
En un post previo te enseñé a enviar un mensaje en nombre de un Bot…
En este artículo te voy a mostrar una guía para imprimir en una impresora térmica…
La impresión de un PDF en cualquier impresora se puede automatizar con un bot de…
Hoy te enseñaré cómo enviar un mensaje a un usuario desde un bot de Telegram…
Esta web usa cookies.