Creación de Componentes Personalizados en Aplicaciones Web

Ahora que sabes cómo podemos crear Componentes en nuestra aplicación, tu reto será crear un componente personalizado que mantenga los badges de cada producto.

De tal manera que dentro de mi Producto solo tenga que usarlo como:

<badge :product="product">

Y este me retorne la lista de badges que un producto pueda tener.

Es decir, si mi producto tiene los badges:

{
    new: true,
    offer: false
}

Dentro de mi producto debería poder ver el badge:

<span class="badge new">Nuevo</span>

Si mi producto tiene los badges:

{
    new: true,
    offer: true
}

Dentro de mi producto debería poder ver los badges:

<span class="badge new">Nuevo</span>
<span class="badge offer">Nuevo</span>

Con este reto podremos aprender mejor cómo registrar nuevos componentes en nuestra aplicación y usarlos dentro de otros componentes y de esta manera ir generando una estructura más organizada en nuestro código.