Aún no tienes acceso a esta clase

Crea una cuenta y continúa viendo este curso

Métodos personalizados con Composition API

23/37
Recursos

Aportes 5

Preguntas 0

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

En la linea 113 falto cambiar la contante product por:

product.value.stock -= 1

Tambien note que si colocas toda la logica de algun tipo en una funcion es todavia mas legible

Esta seria la funcion

function test() {
	const discontCodes = ref([
        	"test", 1
	]);

        function applyDiscont(event) {
        	console.log("TEST", discontCodes.value);
                discontCodes.value[1]++;
                return;
       }

      return {
           discontCodes,
           applyDiscont
      }
}

despues solo la importas en el setup() usando el spread para colocar todo lo retornado por la funcion directo en el arreglo del setup()

setup() {
	return {
		...useTest()
	}
}

En el Composition API se nota como todo el código empieza a quedar más junto 👀 Cosa que en el Options API estaba por separado (unas partes en el bloque de data, otras partes en los bloques de methods, etc.)
.
Una forma fácil de “traducir” de Options a Composition es recordar que todo lo que tenga this en Options será reemplazado por un value en composition, con la única diferencia de que en Options this va al inicio de los nombres de tus propiedades y en Composition value va al final 👀

// Options
this.product

// Composotion
product.value

Dejo el código de esta clase:
.
https://github.com/RetaxMaster/vue3-platzi-commerce/tree/1df1c253776c066eca6d7ea1a573dc1862109a5d

De escribir this.variable ahora escribimos variable.value.
😄

NO OLVIDAR EL VALUE!

function applyDiscount(e) {
          const discountCodeIndex = discountCodes.value.indexOf(e.target.value);
          if (discountCodeIndex >= 0) {
            product.value.price *= 50 / 100;
            discountCodes.value.splice(discountCodeIndex, 1); // remove 1 element of discountCodes in index
          }
        }