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 相关文章推荐
javascript编程起步(第六课)
Feb 27 Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
Nov 19 Javascript
js图片预加载示例
Apr 30 Javascript
基于jquery步骤进度条源码分享
Nov 12 Javascript
兼容浏览器的js事件绑定函数(详解)
May 09 Javascript
Cpage.js给组件绑定事件的实现代码
Aug 31 Javascript
JavaScript面向对象程序设计创建对象的方法分析
Aug 13 Javascript
js中的数组对象排序分析
Dec 11 Javascript
ES6实现图片切换特效代码
Jan 14 Javascript
React生命周期原理与用法踩坑笔记
Apr 28 Javascript
Handtrack.js库实现实时监测手部运动(推荐)
Feb 08 Javascript
Promise静态四兄弟实现示例详解
Jul 07 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 中的str_replace 函数总结
2007/04/27 PHP
php实现判断访问来路是否为搜索引擎机器人的方法
2015/04/15 PHP
理解Javascript_05_原型继承原理
2010/10/13 Javascript
通过正则表达式获取url中参数的简单实现
2016/06/07 Javascript
微信和qq时间格式模板实例详解
2016/10/21 Javascript
静态页面实现 include 引入公用代码的示例
2017/09/25 Javascript
js实现单张图片平移切换效果
2017/10/11 Javascript
ligerUI---ListBox(列表框可移动的实例)
2017/11/28 Javascript
除Console.log()外更多的Javascript调试命令
2018/01/24 Javascript
Node.js实现mysql连接池使用事务自动回收连接的方法示例
2018/02/03 Javascript
vue实现底部菜单功能
2018/07/24 Javascript
echarts设置图例颜色和地图底色的方法实例
2018/08/01 Javascript
详解Vue中的scoped及穿透方法
2019/04/18 Javascript
在 Vue 应用中使用 Netlify 表单功能的方法详解
2019/06/03 Javascript
微信小程序实现点击空白隐藏的方法示例
2019/08/13 Javascript
js实现盒子拖拽动画效果
2020/08/09 Javascript
[04:46]2018年度玩家喜爱的电竞媒体-完美盛典
2018/12/16 DOTA
Python 模块EasyGui详细介绍
2017/02/19 Python
Android分包MultiDex策略详解
2017/10/30 Python
python通过opencv实现批量剪切图片
2017/11/13 Python
python抓取网站的图片并下载到本地的方法
2018/05/22 Python
Python基于property实现类的特性操作示例
2018/06/15 Python
python matlibplot绘制3D图形
2018/07/02 Python
python DataFrame转dict字典过程详解
2019/12/26 Python
python实现ssh及sftp功能(实例代码)
2020/03/16 Python
Python接口开发实现步骤详解
2020/04/26 Python
在线购买廉价折扣书籍和小说:BookOutlet.com
2018/02/19 全球购物
牵手50新加坡:专为黄金岁月的单身人士而设的交友网站
2020/08/16 全球购物
自动化专业个人求职信范文
2013/11/29 职场文书
银行实习生的自我评价
2013/12/09 职场文书
结婚保证书范文
2014/04/29 职场文书
巴西世界杯32强口号
2014/06/05 职场文书
管理人员岗位职责
2015/02/14 职场文书
无婚姻登记记录证明
2015/06/18 职场文书
matlab xlabel位置的设置方式
2021/05/21 Python
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python