美文网首页
watch监听

watch监听

作者: glassUp | 来源:发表于2022-04-13 10:44 被阅读0次

为什么要监听:
这就是异步请求的问题了,就比如我们异步请求一个数据,然而主线程依旧正常运行,当我们监听到数据请求过来了,有数据了,才能再去进行其他操作,这就是监听的意义

watch监听:
1.数据的监听 就像前面的轮播图组件就需要监听数据的变化
2.属性的监听 这个就需要深度监听了

watch监听里面有几个属性:immediate,deep和handler
1.immediate:
我们都知道,watch第一次跟值绑定上时是不会去监听的,只有数据发生改变时,watch才会去执行,而我们想第一次跟值绑定上时就执行一次监听,那就用到immediate属性了

watch: {
    //监听carouselList状态
    carouselList: {
      //立即监听
      immediate:true,
      }
}

2.deep
当我们监听对象身上属性的变化时,普通监听是监听不到的,那就那用到深度监听

watch: {
    //监听carouselList状态
    carouselList: {
      //深度监听
      deep:true
      }
}

3.handler()
这个方法是监听到数据变化了,一般是配合watch成对出现的(监听不就是等状态变化嘛,状态变化了不就是要进行下一步操作嘛)

watch: {
    //监听carouselList状态发生变化
    carouselList: {
      //深度监听
      deep:true
      //立即监听
      immediate:true
      //监听到carouselList状态发生变化了
      handler(){
        //监听到数据后的下一步操作
      }
   }      
}

相关文章

  • AngularJS $watch 监听

    监听$watch监听数据变化,有三个参数 $scope.$watch(“监听的属性”,function(new,o...

  • vue2.x语法知识记录

    watch监听

  • vue监听和webpack基本使用

    vue监听 使用keyup监听 使用watch监听文本框变化,watch 使用这个属性可以监视data中的数据变化...

  • Vue

    watch 和 computed 和 methods 区别 watch:监听,对data的数据监听回调, 当依赖的...

  • Vue computed、watch

    Vue computed、watch watch 监听 immediate第一次渲染时是否执行函数 deep监听对...

  • vue 遇到的坑

    一、watch监听数据 1、监听普通的变量 1、vue.js里面直接用watch监听对象变量,如果对象变量的属性发...

  • 4 Vue计算属性computed、watch监听

    1、计算属性和watch监听的区别: (1).两者都可监听数据的变化,计算属性会return值,watch监听数据...

  • vue composition-api tips

    Watch watch 监听 props 属性时,不能使用解构赋值

  • Vue3-watch和watchEffect

    watch watch可以监听一个或多个响应式数据, 一旦数据变化, 就自动执行监听回调 如果监听rective对...

  • vue 同时监听多个值的变化

    使用computed 和watch来同时监听多个属性值。。 参考原文:vue 使用watch同时监听多个属性[ht...

网友评论

      本文标题:watch监听

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