Khandaker Toihidul Islam
Software Engineer
Backend : PHP | Mysql | Symfony | CakePhp | Wordpress | Drupal
Frontend : Node js | Vue js | React Js | Javascript | HTML | CSS | Bootstrap
Tools , Server : Nginx | Apache | Git | Jenkins | Jira | Asana | Silenium | Spira

Vue Alternative use of Computed properties

<div id="app">
<button v-on:click="count++"> Increment</button>
<button v-on:click="count--"> Decrement</button>
<p> Count: {{ count }}</p>
<button v-on:click="count2++"> Increment Count 2</button>
<p> Count2: {{ count2 }}</p>
<p class="color-red"> Odd / even for count : {{ output }} - {{ result() }} </p>
</div>

<script type="text/javascript">
new Vue({
el: "#app",
data:{
count : 0,
count2 : 0
},
methods:{
result: function(){
console.log('methods');
return this.count % 2 == 0 ? 'Even' : 'Odd' ;
}
},
watch: {
count: function(value){
var vm = this;
setTimeout(function(){
vm.count = 0;
}, 2000);
}
}

});
</script>

Demo http://vue.toihid.com/section-2/watch_alternative_computed_propeerties.php

You may also like...

Leave a Reply

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