Renderización de listas VUEjs

En este video enseño a trabajar las listas en #VUE. Listamos elementos, agregamos de forma dinámica, y damos las bases necesarias para abordar con éxito esta tecnología.

Navega en las lecciones

Inicia sesión para poder registrar las lecciones que has completado Login

Comparte en

Aprenderemos sobre la directiva v-for de Vue.js, ella nos permite iterar de forma dinámica un array de datos y mostrarlos de forma reactiva. Listar los elementos es una practica para apreciar el poder de VUE, podremos agregar y manipular la lista... Te darás cuenta de que VUEjs trabaja con el dato y en base a ellos manipula los elementos visuales.

Así trabajamos en HTML

<div id="main">
    <ul>
        <li v-for="item in people" v-text="item"></li>
    </ul>
    <input type="text" v-model="name" v-on:keyup.enter="addName">
</div>

Este es el módulo creado en VUEjs

<script>
    new Vue({
        el: '#main',
        data: {
            people: ['Lynda', 'Isabella', 'Diana', 'Luisa']
        },
        name: '',
        methods: {
            addName: function(){
                this.people.push(this.name);
                this.name = '';
            }
        }
    });
</script>

Comparte en

Creado por: Venezuela Italo Morales

CEO & Founder de Rimorsoft Online

Más información


Parámetros de tipo objeto en PHP

PHP 3 comentarios

En Rimorsoft hemos ido descubriendo cómo pasar parámetros y asegurarnos de que los tipos sean correctos. Hemos visto un ejemplo muy interesante en post de funciones anónimas, pero no es lo único que podemos hacer.

Herencia de clases - PHP

PHP 4 comentarios

Esto lo entendemos mejor si nos vamos a un diccionario y buscamos la palabra heredar, hay muchas definiciones pero la que aplica es la siguiente:

Componente VUEjs en Laravel

Laravel VUE.js 2 comentarios

Curso de componentes en VUEjs y LARAVEL 5.5, la idea es programar una interfaz que consuma datos de un backend... El componente se creará y se usará desde Laravel.

Clases y Objetos en PHP

PHP 7 comentarios

Las clases nos ayudan a definir una estructura manejable y entendible de nuestro sistema, este termino da vida a los que conocemos como programación orientada a objetos (POO en español, OOP en inglés). La teoría dice, "esto significa que tratas a tu código o partes de él como objetos de la vida real y esto podría resultar muy familiar para nosotros porque nos acerca al mundo tal y como lo conocemos". Aunque parece que esto siempre es confuso.