vue将对象新增的属性添加到检测序列的方法


Posted in Javascript onFebruary 24, 2018

vue中将对象中新增的属性增加到检测序列中

deepCopy(o1, o2) { // 将o2的内容拷贝给data中的o1
   var key, i
   if (o2 instanceof Array) {
    for (i = 0; i < o2.length; i++) {
     if (o2[i] instanceof Array) {
      this.$set(o1, i, [])
      this.deepCopy(o1[i], o2[i])
     }
     else if (o2[i] instanceof Object) {
      this.$set(o1, i, {})
      this.deepCopy(o1[i], o2[i])
     }
     else {
      this.$set(o1, i, o2[i])
     }
    }
   }
   else if (o2 instanceof Object) {
    for (key in o2) {
     if (o2[key] instanceof Array) {
      this.$set(o1, key, [])
      this.deepCopy(o1[key], o2[key])
     }
     else if (o2[key] instanceof Object) {
      this.$set(o1, key, {})
      this.deepCopy(o1[key], o2[key])
     }
     else {
      this.$set(o1, key, o2[key])
     }
    }
   }
   else {
    o1 = o2
   }
}

由于 Vue 不允许动态添加根级响应式属性,所以你必须在初始化实例前声明根级响应式属性,哪怕只是一个空值

如果一个属性没有事先声明,后面再增加,他不能检测到变化,对于一些固定的结构,是可以检测到变化的。比如我知道一个obj里面必然有key1、key2属性,我可以事先初始化。如果这些东西是动态的,我没法事先声明。后面再增加,vue没法检测到变化了。

这时将你已经在data中声明的变量和你要赋给这个变量的值作为参数传进该函数就行了

以上这篇vue将对象新增的属性添加到检测序列的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
调用js时ie6和ie7,ff的区别
Aug 19 Javascript
jquery事件机制扩展插件 jquery鼠标右键事件。
Dec 26 Javascript
JavaScript中合并数组的N种方法
Sep 16 Javascript
JSONP跨域GET请求解决Ajax跨域访问问题
Dec 31 Javascript
JavaScript设计模式之工厂模式和构造器模式
Feb 11 Javascript
jQuery基于图层模仿五星星评价功能的方法
May 07 Javascript
Javascript中for循环语句的几种写法总结对比
Jan 23 Javascript
原生js实现旋转木马轮播图效果
Feb 27 Javascript
AngularJS实现的获取焦点及失去焦点时的表单验证功能示例
Oct 25 Javascript
VUE + UEditor 单图片跨域上传功能的实现方法
Feb 08 Javascript
微信小程序事件对象中e.target和e.currentTarget的区别详解
May 08 Javascript
react PropTypes校验传递的值操作示例
Apr 28 Javascript
jQuery实现碰到边缘反弹的动画效果
Feb 24 #jQuery
vue cli webpack中使用sass的方法
Feb 24 #Javascript
vue-cli常用设置总结
Feb 24 #Javascript
JS处理一些简单计算题
Feb 24 #Javascript
jQuery 改变P标签文本值方法
Feb 24 #jQuery
jQuery实现标签子元素的添加和赋值方法
Feb 24 #jQuery
通过js动态创建标签,并设置属性方法
Feb 24 #Javascript
You might like
用PHP实现登陆验证码(类似条行码状)
2006/10/09 PHP
php各种编码集详解和以及在什么情况下进行使用
2011/09/11 PHP
php漏洞之跨网站请求伪造与防止伪造方法
2013/08/15 PHP
Laravel相关的一些故障解决
2020/08/19 PHP
Javascript中定义方法的另类写法(批量定义js对象的方法)
2011/02/25 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
2014/11/17 Javascript
简介JavaScript中search()方法的使用
2015/06/06 Javascript
angularjs客户端实现压缩图片文件并上传实例
2015/07/06 Javascript
jquery实现ajax加载超时提示的方法
2016/07/23 Javascript
浅谈Cookie的生命周期问题
2016/08/02 Javascript
js实现显示手机号码效果
2017/03/09 Javascript
JavaScript Drum Kit 指南(纯 JS 模拟敲鼓效果)
2017/07/23 Javascript
小程序tab页无法传递参数的方法
2018/08/03 Javascript
vue+animation实现翻页动画
2020/06/29 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
2020/08/13 Javascript
[44:51]2018DOTA2亚洲邀请赛 4.4 淘汰赛 VP vs Liquid 第二场
2018/04/05 DOTA
Python中的魔法方法深入理解
2014/07/09 Python
Python3搜索及替换文件中文本的方法
2015/05/22 Python
python下载图片实现方法(超简单)
2017/07/21 Python
使用Python实现windows下的抓包与解析
2018/01/15 Python
浅谈Python实现2种文件复制的方法
2018/01/19 Python
python实现自动发送报警监控邮件
2018/06/21 Python
Python实现App自动签到领取积分功能
2018/09/29 Python
python实现根据文件关键字进行切分为多个文件的示例
2018/12/10 Python
Python tensorflow实现mnist手写数字识别示例【非卷积与卷积实现】
2019/12/19 Python
Python requests获取网页常用方法解析
2020/02/20 Python
python新手学习使用库
2020/06/11 Python
HTML5-WebSocket实现聊天室示例
2016/12/15 HTML / CSS
Coggles美国/加拿大:高级国际时装零售商
2018/10/23 全球购物
2014旅游局领导班子四风问题对照检查材料思想汇报
2014/09/19 职场文书
初中生散播谣言检讨书
2014/11/17 职场文书
裁员通知
2015/04/25 职场文书
自我检讨书怎么写
2015/05/07 职场文书
Go标准容器之Ring的使用说明
2021/05/05 Golang
mysql的Buffer Pool存储及原理
2022/04/02 MySQL
Centos7 Shell编程之正则表达式、文本处理工具详解
2022/08/05 Servers