1. 程式人生 > >watch監聽事件

watch監聽事件

Vue.js 監聽屬性 watch,可以通過 watch 來響應資料的變化。以下例項通過使用 watch 實現計數器:

<div id="app">
            <p>當前數字:{{count}}</p>
         <button type="button" v-on:click="add()">+</button>
         <button type="button" v-on:click="jf()">-</button>

</div>
        <p id="msg"></p>
<script type="text/javascript">
             var vm = new Vue({
                el:'#app',
                data:{
                    count:0
                },
                methods:{
                    add:function(){
                        this.count++;
                    },
                    jf:function(){
                        this.count--;
                    }
                }                
            });
            vm.$watch('count', function (newValue, oldValue) {
                        // 這個回撥將在 vm.kilometers 改變後呼叫
                        document.getElementById ("msg").innerHTML = "修改前值為: " + oldValue + ",修改後值為: " + newValue;
            })

</script