SOURCE

new Vue({
  el: '#app',
  data: {
   value: 0,
  },
  computed: {
    result:function(){
      return this.value == 10 ? 'done' :'not there yet'
    }
  },
  watch: {
   value: function(value){
     var vm=this;
     setTimeout(function(){
       vm.value=0; // 5秒后重置为0
     },5000);
   }
  },
  methods: {
   	// add5: function(step,event){
   	// this.value+=step;
   	// },
   	// add: function(){
   	// this.value++;
   	// },
  }
})

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<div id="app">
 <!--  1)点击按钮进行增加，一个加5，一个加1。当达到一定数值时就打印出done -->
  <div>
    <p>Current Value: {{ value }}</p>
    <!-- <button @click="add5(5,$event)">Add 5</button>
    <button @click="add">Add 1</button> -->
    <button @click="value +=5">Add 5</button>
    <button @click="value +=1">Add 1</button>
    <p>{{ result }}</p>
  </div>
  <!-- 2)去侦听创建的result属性，一旦有变化就在5庙后重置为0 ,计时器函数叫setTimeout-->
  <div>
    <input type="text" />
    <p>{{ value }}</p>
  </div>
</div>