Tengo un formulario donde el usuario tiene la opción de hacer clic en el botón "Agregar" e ingresar contenido en nuevos campos. Actualmente he generado dinámicamente el modelo v para los campos, pero me di cuenta de que necesito registrar/devolver cada uno de ellos en la función de configuración para usarlos.
¿Cómo genero y registro/devuelvo modelos v para los diferentes campos de entrada si no sé cuántos campos decidirá agregar el usuario?
<div v-for="(content, i) in contentFields" :key="i" > <div>Content {{ i }}</div> <q-input :v-model="`contentName_` + i" outlined type="text" dense /> </div></div>Eche un vistazo al siguiente fragmento con modelos v dinámicos simples, por favor:
new Vue({ el: "#demo", data() { return { contentFields: [{name: '', desc: ''}] } }, methods: { addInput() { let newI = this.contentFields.length this.contentFields.push({name: '', desc: ''}) }, setD() { console.log(this.contentFields) } } }) <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="demo"> <button @click="addInput">add</button> <div v-for="(content, i) in contentFields" :key="i"> <div>Content {{ i }}</div> <input v-model="content.name" outlined type="text" dense @change="setD" /> <input v-model="content.desc" outlined type="text" dense @change="setD" /> </div> </div>