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.

Shaiv Roy

Hy Myself shaiv roy, I am a passionate blogger and love to share ideas among people, I am having good experience with laravel, vue js, react, flutter and doing website and app development work from last 7 years.

Related Articles

Leave a Reply

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

Back to top button