25.Vue监听器(watch)

作者: 圆梦人生 | 来源:发表于2018-06-25 10:46 被阅读54次

    Vue种的监听器主要是来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。

    案例:

    <template>
      <div>
        值:{{watchData}}
        <br/><br/>
        <button @click="watchClcik">改变值</button>
      </div>
    </template>
    <script>
      export default {
        data(){
          return {
            watchData: undefined
          }
        },
        methods:{
          watchClcik(){
              this.watchData = {
                  name: 'name:' + (Math.random() * 10) .toFixed();
              }
          }
        },
        watch:{
          // 监听watchData数据变化
          watchData(value, oldValue){
             console.log('改变的值:');
             console.log(value);
             console.log('旧值:');
             console.log(oldValue);
          }
        }
      }
    </script>
    

    相关文章

      网友评论

        本文标题:25.Vue监听器(watch)

        本文链接:https://www.haomeiwen.com/subject/dqgeyftx.html