JavaScriptVue js

Vue js proper way to clone an element and append to dom

var demo = new Vue({
  el: '#demo',
  data: {
    counter: 0,
    inputs: [{
      id: 'fruit0',
      label: 'Enter Fruit Name',
      value: '',
  methods: {
    addInput() {
        id: `fruit${++this.counter}`,
        label: 'Enter Fruit Name',
        value: '',
<script src=""></script>
<div id="demo">
  <div class="inputArea" v-for="input in inputs" :key="">
    <label :for="">{{input.label}}</label>
    <input :id="" v-model="input.value"></input>
  <button @click="addInput">Add input</button>

Modify that code as per your requirement.

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Check Also
Back to top button

Adblock Detected

Please consider supporting us by disabling your ad blocker