vue中watch的用法

vue中watch的用法当 vue 项目中需要对某个值进行监听做一些操作的时候我们会用到 watch 进行监听 1 监听普通属性 单一字符串 布尔值 等等 data return dvid goodsInfo userInfo closeTime 0 关仓倒计时 watch closeTime newVal oldVal console log newVal oldVal

当vue项目中需要对某个值进行监听做一些操作的时候我们会用到watch进行监听:

1:监听普通属性:

单一字符串,布尔值,等等

data() { 
    return { 
    dvid: '', goodsInfo: [], userInfo:{ 
   }, closeTime:0,//关仓倒计时 } }, 
watch:{ 
    closeTime(newVal, oldVal){ 
    console.log(`${ 
     newVal} : ${ 
     oldVal}`); } }, 

注意:watch第一次绑定值的时候不会执行监听,如果需要第一次就执行监听 则需要设置:immediate: true

watch:{ 
    closeTime: { 
    handler (newName, oldName) { 
    console.log(`${ 
     newVal} : ${ 
     oldVal}`); }, immediate: true } } 

2:监听对象:

监听对象需要用到深度监听 设置deep:true

watch: { 
    closeTime: { 
    handler(newName, oldName) { 
    console.log(`${ 
     newVal} : ${ 
     oldVal}`); }, immediate: true, deep: true } } 

可以可以单独监听对象的某个属性 对象.xxx

监听数组:

注意:与对象监听一样 区别在于数组不需要深度监听

tips:watch中不能使用箭头函数 箭头函数this指向为当前作用域

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/233783.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • javaweb连接mysql数据库完成登录界面(数据库与java连接)

    最近在做项目的时候,对java连接到数据库小有体会,特此来写一篇博客给大家讲解在java中如何连接使用数据库。来展示下效果图:首先,我们来编写关于数据库里的数据操作,包括基本的增删查改以及增加的功能。我在数据库里定义了一个info库,并在库里添加了player表。player表内容如下:可以看到,表里定义了三个变量in…

    2022年4月12日
    35
  • 浅谈路径规划算法_rrt路径规划算法

    浅谈路径规划算法_rrt路径规划算法原文地址:http://theory.stanford.edu/~amitp/GameProgramming/1导言1.1算法1.2Dijkstra算法与最佳优先搜索1.3A*算法2启发式算法2.1A*对启发式函数的使用2.2速度还是精确度?2.3衡量单位2.4精确的启发式函数2.4.1预计算的精确启发式函数2.4.2线性精

    2022年8月23日
    5
  • Activiti工作流框架学习笔记(一)「建议收藏」

    Activiti工作流框架学习笔记(一)「建议收藏」工作流的概念先看下面两张图:对以上两张图进行说明:假设这两张图就是华谊兄弟的请假流程图图的组成部分:人物:范冰冰、冯小刚、王中军事件(动作):请假、批准、不批准通过以上分析我们就可以抽象成:接下来给出工作流的书面化概念:工作流(Workflow),就是“业务过程的部分或整体在计算机应用环境下的自动化”,它主要解决的是“使在多个参与者之间按照某种预定义的规则传递文档、

    2022年10月6日
    3
  • 时序数据库研究现状

    时序数据库研究现状时序数据库——简单汇总

    2022年10月4日
    2
  • java JDBC连接数据库步骤及代码

    java JDBC连接数据库步骤及代码JDBC连接数据库,包含7个步骤(1)加载JDBC驱动程序在连接数据库之前,首先要加载想要连接的数据库的驱动到JVM(Java虚拟机),这通过java.lang.Class类的静态方法forName(StringclassName)实现,成功加载后,会将Driver类的实例注册到DriverManager类中。代码如下:static{ try{ …

    2022年7月26日
    4
  • python数据可视化毕业设计题目_基于Python的数据可视化

    python数据可视化毕业设计题目_基于Python的数据可视化基于Python的数据可视化杨凯利[1];山美娟[2]【期刊名称】《《现代信息科技》》【年(卷),期】2019(000)005【摘要】在大数据快速发展的今天,Python丰富的工具包在科学计算、文件处理、数据可视化等领域越来越凸显其价值。能够发现数据、清洗数据,并使用正确的工具实现数据可视化至关重要。本文叙述了Python软件第三方库的安装和绘图工具的应用,并利用Numpy和Matplotlib库…

    2022年6月27日
    43

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号