Vue Course - Assignment 3 - counter and watcher
Watcher
by nevkatz
HTML
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="exercise">
<p>
Current value: {{ value }}
</p>
<button @click="value+= 1">
Add 1
</button>
<button @click="value+= 5">
Add 5
</button>
<p>
{{ result }}
</p>
</div>
CSS
button {
margin-bottom: 20px;
}
JavaScript
new Vue({
el:"#exercise",
data:{
value:0
},
computed:{
result:function() {
const limit = 3;
return (this.value > 3) ? 'done' : 'not done';
}
},
watch: {
value:function() {
var vm = this;
window.setTimeout(function() {
vm.value = 0;
},5000);
}
}
});