[Vuejs]-Push component in vue

by

1👍

✅

You can transform your fields into a fields array:

data () {
  return {
    inputs: []
  }
}

Your addWork method becomes a method that push a new value in this inputs array:

methods: {
  doWork () {
    this.inputs.push({
      label: 'Test',
      value: ''
    })
  }
}

And you display those inputs with a v-for directive:

<v-row>
  <v-col cols="2" v-for="(input, index) in inputs" :key="index">
    <v-row class="mx-1 my-1">
      <v-text-field outlined :label="input.label" v-model="input.value"></v-text-field>
     </v-row>
   </v-col>
 </v-row>

Working example: https://codesandbox.io/s/festive-dream-gbo6t?file=/src/App.vue

👤Zooly

Leave a comment