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 相关文章推荐
URL编码转换,escape() encodeURI() encodeURIComponent()
Dec 27 Javascript
js类后台管理菜单类-MenuSwitch
Sep 12 Javascript
js前台判断开始时间是否小于结束时间
Feb 23 Javascript
jQuery Validate 验证,校验规则写在控件中的具体实例
Feb 27 Javascript
使用npm发布Node.JS程序包教程
Mar 02 Javascript
JavaScript实现非常简单实用的下拉菜单效果
Aug 27 Javascript
JS中检测数据类型的几种方式及优缺点小结
Dec 12 Javascript
JavaScript中document.referrer的用法详解
Jul 04 Javascript
使用AngularJS编写多选按钮选中时触发指定方法的指令代码详解
Jul 24 Javascript
详解Vue用cmd创建项目
Feb 12 Javascript
JavaScript正则表达式验证登录实例
Mar 18 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
Aug 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去除重复字的实现代码
2011/09/16 PHP
PHP 验证码不显示只有一个小红叉的解决方法
2013/09/30 PHP
php简单判断文本编码的方法
2015/07/30 PHP
分析PHP中单双引号的误区和双引号小隐患
2016/07/19 PHP
PHP实现的随机红包算法示例
2017/08/14 PHP
js 通过html()及text()方法获取并设置p标签的显示值
2014/05/14 Javascript
Javascript中Array用法实例分析
2015/06/13 Javascript
Bootstrap每天必学之弹出框(Popover)插件
2016/04/25 Javascript
浅谈jquery的map()和each()方法
2016/06/12 Javascript
ES6正则表达式的一些新功能总结
2017/05/09 Javascript
vue axios 表单提交上传图片的实例
2018/03/16 Javascript
js实现图片局部放大效果详解
2019/03/18 Javascript
JavaScript+HTML5 canvas实现放大镜效果完整示例
2019/05/15 Javascript
vue $set 给数据赋值的实例
2019/11/09 Javascript
[03:56]还原FTP电影首映式 DOTA2群星拼出遗迹世界
2014/03/26 DOTA
Python实现对字符串的加密解密方法示例
2017/04/29 Python
Python实现查找最小的k个数示例【两种解法】
2019/01/08 Python
对于Python深浅拷贝的理解
2019/07/29 Python
简单的Python人脸识别系统
2020/07/14 Python
Python爬虫实现自动登录、签到功能的代码
2020/08/20 Python
html5开发三八女王节表白神器
2018/03/07 HTML / CSS
德国滑雪和户外用品网上商店:XSPO
2019/10/30 全球购物
如果有两个类A,B,怎么样才能使A在发生一个事件的时候通知B
2016/03/12 面试题
学生会竞选自荐信
2013/10/12 职场文书
仓库管理专业个人的自我评价
2013/12/30 职场文书
求职简历的自我评价
2014/01/31 职场文书
2014年销售助理工作总结
2014/12/01 职场文书
2015年教师节活动总结
2015/03/20 职场文书
公务员保密工作承诺书
2015/05/04 职场文书
领导干部失职检讨书
2015/05/05 职场文书
简短清晨问候语
2015/11/10 职场文书
七年级之开学家长寄语35句
2019/09/05 职场文书
2019年市场部个人述职报告(三篇)
2019/10/23 职场文书
python编写函数注意事项总结
2021/03/29 Python
Nginx+Tomcat实现负载均衡、动静分离的原理解析
2021/03/31 Servers
为自由献出你的心脏!「进击的巨人展 FINAL」2022年6月在台开展
2022/04/13 日漫