[Vuejs]-Cannot duplicate my form with v-for vuejs help needed

by

0👍

✅

This is es-lint error. To solve change this line like this (remove the unused i)

addLines() {
  this.inputs.push({ text: "", sec: 0 });
}

and change your template to:

<v-form
  ref="form"
  class="container"
  v-for="(input,i) in inputs"
  :key="i"
  lazy-validation
>
  <v-container class="container">
    <v-layout>
      <v-flex lg12 class="container">
        <v-text-field
          v-model="input.text"
          label="Text"
          placeholder=""
          required
        ></v-text-field>
      </v-flex>

      <v-flex lg3 class="container">
        <v-text-field
          v-model="input.sec"
          label="Millisec"
          required
          type="number"
        ></v-text-field>
      </v-flex>

      <v-flex lg12 class="container">
        <v-btn color="black" @click="addLines(i)" v-show="i == inputs.length-1"
          >ADD</v-btn
        >
      </v-flex>
      <v-flex lg6 class="container">
        <v-btn color="dark" @click="onSubmit">Submit</v-btn>
      </v-flex>
    </v-layout>
  </v-container>
</v-form>

Leave a comment