vue data中的对象的属性如何使用watch监听
在写项目的时候遇到了一个问题,就是需要动态监听data中一个对象的属性的变化。遇到了许多坑,在此过程中也发现了两种解决方案。
一、通过deep属性实现
data() {
return {
parent:{
child:1
}
};
},
watch:{
'parent.child':{
deep:true,
handler: function(newV, oldV) {
console.log(newV);
}
}
}
二、通过computed做中介
computed:{
newChild(){
return this.parent.child;
}
}
watch:{
newChild(newV,oldV){
alert(newV)
}
},
返回目录
vue data中的对象的属性如何使用watch监听的更多相关文章
- 统计Mongo数组中相同对象的属性之和
统计Mongo数组中相同对象的属性之和 需求 需要统计app端用户的行为,按天分表,存入mongo.每次用户进行操作的时候,将数据存入app本地,下次用户启动的时候,提交存入mongo,删除app本地 ...
- [原创]java WEB学习笔记59:Struts2学习之路---OGNL,值栈,读取对象栈中的对象的属性,读取 Context Map 里的对象的属性,调用字段和方法,数组,list,map
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
- HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次)
HTML中DOM对象的属性和方法的层级关系是怎样的?(目录即层次) 一.总结 一句话总结:目录就是测试题 1.document取得元素(get element)的方式有哪几种? 解答:四种,分别是id ...
- vue中的computed(计算属性)和watch(监听属性)的特点,以及深度监听
//计算属性是根据data中已有的属性,计算得到一个新的属性, <div>全名:{{fullName}}</div> 创建计算属性通过computed关键字,它是一个对象 计算 ...
- JAVA中JavaBean对象之间属性拷贝的方法
JAVA中JavaBean对象之间的拷贝通常是用get/set方法,但如果你有两个属性相同的JavaBean或有大部分属性相同的JavaBean,对于这种情况,可以采用以下几个简便方法处理. 下面对这 ...
- 全面理解Javascript中Function对象的属性和方法
http://www.cnblogs.com/liontone/p/3970420.html 函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这 ...
- List集合中的对象根据属性排序
集合类List存放的数据,默认是按照放入时的顺序存放的,比如依次放入A.B.C,则取得时候,则也是A.B.C的顺序,实际场景中,有时我们需要根据自定义的规则对List中的元素进行排序,该如何实现呢?看 ...
- JS中访问对象的属性
方式一: 对象名.属性名; 方式二: 对象名["属性名"]; ★注意:方式二中,属性名以字符串的形式出现在方括号中,这意味着通过方式二访问属性的话,可以实现“动态访问对象的 ...
- 你好,C++(38)从问题描述中发现对象的属性和行为 6.4 工资程序成长记:类与对象(上)
6.4 工资程序成长记:类与对象 “夜半三更哟,盼天明:寒冬腊月哟,盼春风.若要盼得哟,涨工资,岭上……”自从上次老板许诺给小陈涨工资以后,一转眼又过去几个月了,可是涨工资的事一点动静都没有.小陈只 ...
随机推荐
- Ajax fileUpload
在项目开发中用到ajax 的 fileUpload,遇到onchange事件只触发一次 原因是fileUpload调用后将原有的file元素改变了,需要早upload后重新绑定元素 第一次绑定: $( ...
- jenkins"控制台输出"乱码问题解决
今天在搭建Jenkins环境时,安装完Tomcat.Jenkins.创建项目进行构建后,在查看控制台输出时,结果中文全部显示乱码.然后呢,就是漫长的解决历程,最终呢,解决乱码问题的时间终于超过了环境搭 ...
- Apache、nginx 、lighttpd性能比较
Apache.nginx .lighttpd性能比较 1. web服务器简介 1. lighttpd Lighttpd是一个德国人领导的开源软件,其根本的目的是提供一个专门针对高性能网站,安全.快速. ...
- struts2编写表单提交简单的(2)
实体 package com.oak.entity; public class User {private int id;private String username;private String ...
- [ML] The Basics: Training Your First Model
The problem we will solve is to convert from Celsius to Fahrenheit, where the approximate formula is ...
- 【Android-数据库Sqlite】Sqlite数据库 增、删、改、查
1.先创建一个Product类 Product.java 变量如下: int id; String code; String name; int qty; 2.创建一个DBHelper类 DBHelp ...
- Unable to copy file, Access to the path is denied
Unable to copy file, Access to the path is denied http://stackoverflow.com/questions/7130136/unable- ...
- 微软企业库Unity依赖注入
Unity Application Block 1.0系列(4): 方法调用注入(Method Call Injection ) http://www.cnblogs.com/inrie/archiv ...
- 二维FFT,IFFT,c语言实现
学习DIP第6天 完整内容迁移至http://www.face2ai.com/DIP-2-4-二维FFT-IFFT-c语言实现/ http://www.tony4ai.com/DIP-2-4-二维FF ...
- vundle
vundle插件的使用方法: http://adam8157.info/blog/2011/12/use-vundle-to-manage-vim-plugins http://adam8157.in ...