En esta charla, Adam habló sobre el uso de Scoped Slots (disponibles a partir de Vue +2.1.0) para la construcción avanzada de componentes con Vue.js. En este post te daremos un resumen de la charla de Adam para Laracon Online 2018.
En esta lección vamos a explorar un poco más sobre el uso de acciones en Vuex y su naturaleza asíncrona. Para ello vamos a continuar practicando sobre el uso de Promesas en JavaScript y veremos los enfoques optimista y pesimista que podemos elegir cuando desarrollemos aplicaciones que deban enviar y recibir datos a un servidor a través de AJAX.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Las Promesas de ES6 son una alternativa a las funciones callback cuando requerimos una manera de manejar solicitudes asíncronas en JavaScript. Las Promesas nos permiten definir las acciones que deben ejecutarse una vez que la operación definida dentro de la Promesa finalice con éxito o con error. En el siguiente video veremos una introducción al tema de las promesas y de las operaciones asíncronas, la cual será muy útil cuando regresemos a Vuex.
Regístrate para ver ésta y cientos de lecciones exclusivas.
En esta lección vamos a comenzar a integrar Vuex en nuestro proyecto de Single-page Application (SPA) con vue-router. Para ello vamos a reemplazar la versión manual del Store que creamos en lecciones anteriores con una implementación de Vuex y además del State, los getters y las mutaciones que ya vimos en lecciones anteriores, en esta lección también daremos nuestro primer vistazo a las acciones de Vuex.
Regístrate para ver ésta y cientos de lecciones exclusivas.
En esta lección continuaremos aprendiendo sobre Vuex, esta vez veremos cómo podemos integrar nuestro Store con Vue.js y también algunos de los helpers y métodos que podemos utilizar para simplificar y evitar la repetición de código dentro de nuestros componentes (como por ejemplo el uso de los métodos mapState y mapMutations).
Regístrate para ver ésta y cientos de lecciones exclusivas.
En la lección anterior pudimos apreciar el problema que se presenta cuando necesitamos compartir o modificar datos entre muchos componentes y cómo resolverlo con el uso de eventos. Pero en esta lección veremos otro enfoque para resolver este problema: Vuex. Con Vuex podremos centralizar el manejo de estado y la modificación del mismo en una sola parte que nuestra aplicación, que llamaremos Store. Dentro del Store vamos a encapsular los datos de nuestra aplicación (llamados «State» o «estado») y los métodos que harán posible modificar dicho estado (llamados «Mutations» o «mutaciones»).
En el siguiente video vamos a instalar Vuex, a configurarlo y utilizarlo en nuestro proyecto de ejemplo:
Regístrate para ver ésta y cientos de lecciones exclusivas.
En las lecciones anteriores del Curso de Vue, hemos aprendido cómo pasar y modificar datos de un componente a otro combinando el paso de propiedades con la emisión de eventos personalizados. Pero como habrás podido notar, en ciertas ocasiones este modelo puede no resultar suficiente o resultar engorroso, por ejemplo imagina casos donde tenemos muchos componentes que necesitan compartir información o estamos creando una Single-page Application (SPA).
En esta lección voy a dar un repaso sobre componentes y eventos personalizados, para que podamos -una vez más- apreciar el problema antes de aplicar la solución con Vuex.
Regístrate para ver ésta y cientos de lecciones exclusivas.
En esta lección aprenderemos que es el estado de la aplicación (state) y cómo hacer uso de éste para pasar propiedades entre diferentes componentes para generar reactividad en nuestra aplicación.
Regístrate para ver ésta y cientos de lecciones exclusivas.
En esta lección vamos a resolver el ejercicio de la lección anterior para seguir practicando sobre la creación de componentes con el uso de Render Functions y DOM Virtual.
Regístrate para ver ésta y cientos de lecciones exclusivas.
En esta lección veremos un nuevo concepto que no hemos aprendido hasta ahora llamado Render Functions. Las Render Functions no son más que funciones de JavaScript que retornar algo llamado DOM Virtual, que no es más que un objeto de JavaScript que Vue.js utiliza para representar una plantilla y finalmente procesar e imprimir los elementos actuales del DOM en el navegador. Las Render Functions pueden utilizarse como un reemplazo de las plantillas en ciertos casos más avanzados y en esta lección veras un ejemplo del uso de Render Functions con un componente personalizado de Vue.js.
Regístrate para ver ésta y cientos de lecciones exclusivas.