Del curso: Vue avanzado 1

Accede al curso completo hoy mismo

Únete hoy para acceder a más de 23.100 cursos impartidos por expertos del sector.

Creando directivas customizadas en Vue

Creando directivas customizadas en Vue - Tutorial de Vue

Del curso: Vue avanzado 1

Creando directivas customizadas en Vue

En esta lección te voy a explicar cómo puedes crear tus propias directivas. En esta aplicación yo he creado una directiva que cambia el color de fondo de la etiqueta HTML a la que esté adjunta. Yo la estoy utilizando para cambiar los colores de las filas de esa tabla de manera alterna, como puedes ver aquí. Si nos dirigimos al código, verás que esta es la directiva que yo he creado, se llama v-cambiarColor. Cambiar color recibe un valor como String de un color el cual se aplica a la etiqueta donde ha sido adjunta. Aquí yo estoy utilizando el 'index' de este v-for para determinar si el número es par o no y así poder agregar el color gris o blanco como corresponda. El código para crear esta directiva se encuentra en el archivo 'main.js'. Para crear una directiva global es necesario llamar la función 'directive' dentro de la instancia de la aplicación. Aquí pasamos un nombre, que es el que se utiliza para llamar la directiva dentro de la etiqueta HTML, y luego pasamos un objeto con…

Contenido