首页 > 其他分享 >值类型的侦听器watch不触发 immediate: true

值类型的侦听器watch不触发 immediate: true

时间:2023-07-21 12:24:15浏览次数:31  
标签:变量 default watch immediate 侦听器 组件 true

现象:一个组件的变量有初始值,然后,如果在引用该变量的页面onLoad中为组件的变量赋不同的新值,不触发对该变量的watch回调

原因:onLoad的时候,组件还没有初始化完成,修改其变量的值相当于给它一个初始化的值,所以不会触发watch的回调。

解决:watch 里应该加上immediate: true,以便在创建侦听器时,立即执行一遍回调。

组件radios中

export default {
  props: {
    current: {
      type: [String, Number],
      default: '0',
    },
  },
  data () {
    return {
      selectIndex: 0
    }
  },
  watch: {
    current: {
      handler (val) {
        this.selectIndex = val
      },
      immediate: true
    }
  }
}

引用组件的页面

<template>
    <view>
        <Radios :current="radioIndex"/>
    </view>
</template>
<script>
import Radios from './radios';
export default {
    components: {
        Radios
    },
    data () {
        return {
            radioIndex: 0
        }
    },
    onl oad (options) {
        this.radioIndex = 1
    }
}
</script>    

 

标签:变量,default,watch,immediate,侦听器,组件,true
From: https://www.cnblogs.com/liuyongfa/p/17570958.html

相关文章

  • VUE|侦听器
    1侦听器1)什么是侦听器可以通过watch配置项,监听已经存在的属性的改变2)语法watch:{//监听data中的firstName属性firstName(){//执行一系列的操作},},watch:{//监听data中的firstName属性firstName(){//执行一系列的操作},},示例......
  • SpringBoot系列---【StopWatch优雅实现统计代码耗时】
    StopWatch优雅实现统计代码耗时#org.springframework.util.StopWatchStopWatchstopWatch=newStopWatch();stopWatch.start("task1");//逻辑代码1...stopWatch.stop();log.debug("task1执行耗时:{}ms",stopWatch.getLastTaskTimeMillis());stopWatch.start("......
  • list watch机制
    3点需求只需要感知数据最新的状态,不担心错过数据的变化过程。需求1:实时性(即数据变化时,相关组件越快感知越好)需求2:保证消息的顺序性(即消息要按发生先后顺序送达目的组件。很难想象在Pod创建消息前收到该Pod删除消息时组件应该怎么处理)需求3:保证消息不丢失或者有可靠的重......
  • vue-day16---watch与computed实现列表过滤
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>watch与computed实现列表过滤</title>......
  • LayoutRebuilder.ForceRebuildLayoutImmediate的使用和坑点
    LayoutRebuilder.ForceRebuildLayoutImmediate可以强制刷新layout组件,在使用layout和contentsizefitter组件制作如聊天框这种根据文字改变大小之类的UI时很好用。不过LayoutRebuilder.ForceRebuildLayoutImmediate有个坑点,其只有在物体激活时才会生效。......
  • kubernetes 实现 list-watch 的底层原理
    我们都知道,controller-manager,scheduler,kubelet会向apiserver监听感兴趣的对象,当监听对象的内容或状态发生变化后,对应的事件会立即推送到监听者。借由这套事件通知机制,kubernetes才能良好地运转。那么这套事件通知机制是如何实现并驱动的呢?1.etcd在k8s中,apiserver是......
  • Scala连接Hbase集群出现异常tried to access method com.google.common.base.Stopwatc
    总结/朱季谦在新项目上创建以下Scala代码去连接Hbase集群,用来判断Hbase是否存在某张表。//离线Hbasevalconf:Configuration=HBaseConfiguration.create()conf.set("hbase.zookeeper.quorum","192.168.1.200")conf.set("hbase.zookeeper.property.clientPort","2181&......
  • arpwatch
    arpwatch监听网络上ARP的记录补充说明arpwatch命令用来监听网络上arp的记录。语法arpwatch(选项)选项-d:启动排错模式;-f<记录文件>:设置存储ARP记录的文件,预设为/var/arpwatch/arp.dat;-i<接口>:指定监听ARP的接口,预设的接口为eth0;-r<记录文件>:从指定的文件中读取ARP记录,......
  • vue--day13--watch与computed的区别
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>watch实现名字案例</title><scri......
  • watchEffect函数
    watch的套路是:既要指明监视的属性,也要指明监视的回调。watchEffect的套路是:不用指明监视哪个属性,监视的回调中用到哪个属性,那就监视哪个属性。watchEffect有点像computed:但computed注重的计算出来的值(回调函数的返回值),所以必须要写返回值。而watchEffect更注重的是......