JSFiddle - React, Tailwind, and code Playground

by VeVeO

HTML

<div id="page">
<button v-on:click="addEll">Добавить элемент</button>
{{ arr }}
{{ count }}
  <ul>
    <li v-for="(item, index) in visibleList">
        {{item}}
        <button v-on:click="incrementio(index)">{{count[index]}}</button>
    </li>
  </ul>
</div>

Vue

new Vue({
	el: '#page',
  data: {
  	arr: [1, 2 ,3],
    count: [0, 0 ,0]
  },
  methods: {
  	addEll: function() {
    	this.arr.push(this.arr.length + 1);
      this.count.push(0);
    },
    incrementio: function(val) {
        interval = setInterval(() => {
        //Без этой штуки, массив не обновляется в реальном времени
        Vue.set(this.count, this.count[val], 0);
        this.count[val]++;
      }, 1000);
     },
  },
  computed: {
  	visibleList: function(){
    	return this.arr;
    }
  }
  
})