vue可以通过watch监听data内数据的变化。通常写法是:

data: {
a: 100
},
watch: {
a(newval, oldVal) {
// 做点什么。。。
console.log(newval, oldVal)
}
}

vue监听整个对象,如下:

  • deep: true 深度监测
data: {
return {
msg: {
name: 'hahah',
color: 'red'
}
}
}
watch: {
msg: {
handler(newValue, oldValue) {
// 做点什么。。。
console.log(newValue)
},
deep: true
}

如果监听对象内的某一具体属性,可以通过computed做中间层来实现:

computed: {
name() {
return this.msg.name
}
},
watch:{
name(newValue, oldValue) {
// 做点什么。。。
console.log(newValue, oldValue)
}
}

  

  

vue watch关于对象内的属性监听的更多相关文章

  1. vue对象属性监听

    对象属性监听的两种方法: 1.普通的watch data() { return { frontPoints: 0 } }, watch: { frontPoints(newValue, oldValu ...

  2. Vue基本使用---对象提供的属性功能

    一 过滤器 过滤器就是vue允许开发者自定义的文本格式化函数, 可以使用在两个地方:输出内容和操作数据中. 1.1 定义过滤器的两种方式 1.1.1 使用Vue.filter()进行全局定义 Vue. ...

  3. Vue 变量,成员,属性监听

    Vue变量 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF ...

  4. Vue.js之计算属性(computed)、属性监听(watch)与方法选项(methods)

    vue.js官网:https://cn.vuejs.org/v2/guide/components-registration.html 一.计算属性-computed 1. 作用:能够避免数据冗余,通 ...

  5. vue2.x版本中Object.defineProperty对象属性监听和关联

    前言 在vue2.x版本官方文档中 深入响应式原理 https://cn.vuejs.org/v2/guide/reactivity.html一文的解释当中,Object.defineProperty ...

  6. Vue之计算属性Computed和属性监听Watch,Computed和Watch的区别

    一. 计算属性(computed) 1.计算属性是为了模板中的表达式简洁,易维护,符合用于简单运算的设计初衷. 例如: <div id="app"> {{ myname ...

  7. 微信小程序实现watch属性监听数据变化

    Vue 提供了一种通用的方式来观察和响应 Vue 实例上的数据变动:监听属性 watch. 虽然watch的滥用会导致性能不佳,但在一些情况下我们还是需要watch,使得代码更加简洁.逻辑更加清晰(其 ...

  8. 迷你MVVM框架 avalonjs 学习教程15、属性监听与模块通信

    avalon的ViewModel对象从其内部EventManager里继承了三个方法,$watch.$unwatch.$fire三个方法,它们就是我们本节的主题. 词如其名,非常直白,一看就知道做什么 ...

  9. 深入理解 Getter和Setter 对对象的属性监听

    阅读目录 一:理解普通对象在声明时添加 get.set 二:Object.prototype.__defineGetter__ 和 Object.prototype.__defineSetter__ ...

随机推荐

  1. 如何发挥ERP系统中的财务监控职能?

    ERP系统的管理理念与特点 ERP,是整合了企业管理理念.业务流程.基础数据.人力物力.计算机硬件和软件于一体的企业资源管理系统.ERP系统运用信息技术将企业的资金流.物资流.信息流进行有效的集成,使 ...

  2. 131.008 Unsupervised Learning - Principle component Analysis |PCA | 非监督学习 - 主成分分析

    @(131 - Machine Learning | 机器学习) PCA是一种特征选择方法,可将一组相关变量转变成一组基础正交变量 25 PCA的回顾和定义 Demo: when to use PCA ...

  3. mybatis 一对一 映射实体类、嵌套查询

    一对一 在SysUser 类中增加SysRole字段.1.sql语句将role.role_name映射到role.roleName上. 2.还可以在XML 映射文件中配置结果映射.<result ...

  4. 【Python】Java程序员学习Python(一)— 为什么学习Python

    现在是6月份,毕业快3年了,虽然不能说对Java掌握的程度达到了如火纯青的地步,但是依然感觉到了瓶颈期,Java用的多了,也到了随心所欲的地步了,所以学第二门语言的想法一直在我脑海里闪现,有想法了就要 ...

  5. 干货:如何使用N点虚拟管理系统?

    N点虚拟主机管理系统怎么用呢?最近有许多朋友问我关于这款虚拟主机管理系统如何使用?在讲如何使用N点虚拟主机管理系统之前,我们先来了解一下N点虚拟主机管理系统的介绍. ​      N点虚拟主机管理系统 ...

  6. Oracle EBS AR 收款API收款方法标识无效

    1.确认是不是没有收款方法 methods那个表的问题2.查看收款方法那个LOV的问题3.界面录入 是否会有问题  碰到的问题是 收款日期比较早时 找不到对应的收款方法 银行账户需要重新设置

  7. 发布MVCIIS报错未能加载文件或程序

    未能加载文件或程序集“System.Web.Http.WebHost, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e3 ...

  8. Mysql5.7 的错误日志中最常见的note级别日志解释

          在使用mysql5.7的时候,发现了不少在mysql5.6上不曾见过的日志,级别为note, 最常见的note日志以下三种,下面我们来逐个解释. 第一种,Aborted connectio ...

  9. (matlab)plot画图的颜色线型(转)

    http://wenku.baidu.com/link?url=SVVMVH8QlDIu2hVKDtoBYs6l0CnQvFnFHJJ9yexmYVKQqhz47qIr7aK7LOf8nN0qNdy8 ...

  10. Collection集合 总结笔记

    2:Set集合(理解)     (1)Set集合的特点         无序,唯一     (2)HashSet集合(掌握)         A:底层数据结构是哈希表(是一个元素为链表的数组)     ...