Estoy tratando de aprender vue y me encontré con un pequeño obstáculo. ¿Hay alguna manera de que esto funcione? Quiero insertar un nuevo valor en mi matriz de elementos con mi componente Button para poder representarlo con v-for. Sé que sería mucho más fácil poner todo en un solo archivo, solo por curiosidad si se puede hacer de esta manera. Aquí está el código:
https://codesandbox.io/s/mistificando-antonelli-7o6m6o?file=/src/App.vue
cualquier ayuda sería muy apreciada :)
Seguro que esto se puede hacer de la manera que le gustaría. Una forma de hacerlo es definir las variables y la función de agregar en App.vue.
<script setup> import { ref } from "vue"; const name = ref(""); const amount = ref(0); const items = ref([]); const addItem = () => { items.value.push = { name: name.value, amount: amount.value }; name.value = ""; amount.value = 0; }; </script>Vincule el nombre y la cantidad con sus entradas a través de v-model y vincule addItem a su botón con @click. Puede usar elementos como apoyo para su componente ItemList.
Sus componentes necesitan cambios para funcionar, pero espero que esto le sirva de orientación. Tal vez primero haga que funcione con elementos de botón y entrada html simple y use {{ items }} para representar la matriz de elementos. Una vez que eso funcione, puede crear los componentes personalizados.
Espero que esto ayude.