Estoy tratando de encontrar una manera de seleccionar múltiples variaciones de elementos de una interfaz de Vue dentro de un sitio web de WooCommerce.

Instalé el complemento WC Ajax Cart para tener algún tipo de punto final al que pueda llamar usando AXIOS.

Cada opción selecciono anuncios y le doy a una matriz de productos selectedProducts llamada

Cuando el usuario presiona en el checkout lo que hago es:

 this.textCheckout = "Checking you out..."; //No pun intended actually xD this.products.forEach((item, i) => { if(this.selectedProducts.includes(item.variation_id)) { let adder = new FormData(); adder.append('attribute_alege-zona', Object.values(item.attributes)[0]); adder.append('attribute_tratament', Object.values(item.attributes)[1]); adder.append('quantity', 1); adder.append('product_id', item.variation_id); adder.append('variation_id', item.variation_id); console.log(adder); let me = this; let apel = setTimeout(function(){ axios({ method: "post", url: "https://HOST/?wc-ajax=add_to_cart", data: adder, headers: { "Content-Type": "multipart/form-data" }, }) .then(function (response) { }) .catch(function (response) { console.log(response); }); },1000) } }); let goCart = setTimeout(function() { window.location.href = "https://HOST/cart"; }, 1500 * this.alese.length);

Puede preguntar por qué agregué esas funciones setTimeout . En mi cabeza tenía sentido que en caso de que la llamada se demore, estoy seguro de que agregaré todos los productos al carrito. El máximo que puedo agregar es dos.

Si digamos que selecciono 5 productos, cuando me redirigen a mi carrito solo puedo ver 2 de ellos, a veces 3 (es realmente aleatorio)

¿Tiene alguna idea de cómo puedo agregar todos los productos seleccionados a la misma sesión de carrito?

¡Gracias por adelantado!