JSFiddle - React, Tailwind, and code Playground
by alekzonder
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.10/vue.min.js"></script>
<div id="body"></div>
JavaScript
var app = new Vue({
template: `
<div>
<ul v-for="todo in todos">
<li>{{todo.title}}</li>
</ul>
<br>
<input type="text" v-model="newOne"/><button @click="add">Add #{{autoinc}}</button>
</div>
`,
data: function() {
return {
todos: [],
newOne: '',
autoinc: 1
}
},
methods: {
add: function () {
this.todos.push({id: this.autoinc, title: this.newOne});
this.autoinc++;
this.newOne = '';
}
}
});
app.$mount('#body');