• 8、vue中得监听属性:watch--- /////watch、computed、methods得区别


    1、vue中得监听属性:watch
    watch就是用来监听数据变化得,当数据模型(data中得数据)发生改变时,watch就会被触发

    2、watch提供得是响应数据得变化,并且是自动进行响应得
    数据变化得时候执行异步或开销较大得一些操作,会常使用得是watch来实现得

    <template>
      <div id='app'>
           <input type="text" v-model="year">
           <input type="text" v-model="month">
           <p>出生年月:{{year}}年:{{month}}月</p>
           <div>输入的次数{{count}}</div>
           <div>{{brith}}</div>
      </div>
    </template>
    
    <script>
    export default {
      name: 'App',
      data () {
        return {
              year:1996,
              month:3,
              count:0
        }
      },
      computed: {
        brith () {
    
           return this.year   + this.month
        } 
      },
      watch : {
         year () {
              return this.count++
    
             },
          month () {
               return this.count++
    
         }
      

    重点!!!!

       

    Computed

    一个数据受多个数据影响,在执行得时候如果computedwatch同时存在,先执行得是computed,在执行watch

    Computed是具有缓存得,这也就意味着只要计算书得依赖没有进行响应得数据更新,那么computed会直接从缓存中获取值,并且多次访问都会返回之前得计算结果

    Caomputed是通过计算改变得,watch是用过观察改变得

    计算是通过变量计算来得到得数据

    观察是观察一个特定得值,根据被观察者得改变从而进行响应得改变

    Watch

    computed很相似,也是数据改变会执行,用来监听数据变化得

    Watch本身是一个对象,里边得key是需要观察得数据,value是当数据发生变化得时候执行得回调函数

    擅长得是一个数据影响多个数据

    Methods

    其实就是单纯得放函数得对象

  • 相关阅读:
    Activiti(三)流程变量和流程实例
    vue(生命周期,钩子方法,组件)
    Vue(指令篇)
    Activiti(二)
    使用MyBatis_Plus生成代码
    activiti
    多线程常见面试题总结
    Dubbo集群-负载均衡
    dubbox入门
    事务的传播行为,隔离级别以及锁机制
  • 原文地址:https://www.cnblogs.com/taozhibin/p/13122296.html
Copyright © 2020-2023  润新知