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 相关文章推荐
jQuery表格行换色的三种实现方法
Jun 27 Javascript
JS中产生20位随机数以0-9为例也可以是a-z A-Z
Aug 01 Javascript
jQuery实现form表单元素序列化为json对象的方法
Dec 09 Javascript
Bootstrap按钮功能之查询按钮和重置按钮
Oct 26 Javascript
JavaScript中Math对象的方法介绍
Jan 05 Javascript
Vue学习笔记进阶篇之vue-cli安装及介绍
Jul 18 Javascript
详解react使用react-bootstrap当轮子造车
Aug 15 Javascript
Vue-cli 使用json server在本地模拟请求数据的示例代码
Nov 02 Javascript
基于Vue制作组织架构树组件
Dec 06 Javascript
VUE2 前端实现 静态二级省市联动选择select的示例
Feb 09 Javascript
15 分钟掌握vue-next响应式原理
Oct 13 Javascript
JavaScript 中判断变量是否为数字的示例代码
Oct 22 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防注入代码
2010/04/07 PHP
php实现zip文件解压操作
2015/11/03 PHP
PHP数组函数知识汇总
2016/05/12 PHP
PHP实现二维数组根据key进行排序的方法
2016/12/30 PHP
PHPCrawl爬虫库实现抓取酷狗歌单的方法示例
2017/12/21 PHP
PHP扩展Swoole实现实时异步任务队列示例
2019/04/13 PHP
laravel 修改.htaccess文件 重定向public的解决方法
2019/10/12 PHP
js自带函数备忘 数组
2006/12/29 Javascript
javascript中encodeURI和decodeURI方法使用介绍
2013/05/06 Javascript
js验证整数加保留小数点的简单实例
2013/12/02 Javascript
javascript操纵OGNL标签示例代码
2014/06/16 Javascript
indexOf 和 lastIndexOf 使用示例介绍
2014/09/02 Javascript
原生javascript实现简单的datagrid数据表格
2015/01/02 Javascript
推荐一个自己用的封装好的javascript插件
2015/01/29 Javascript
原生JS实现仿淘宝网左侧商品分类菜单效果代码
2015/09/10 Javascript
bootstrap Table实现合并相同行
2019/07/19 Javascript
JsonServer安装及启动过程图解
2020/02/28 Javascript
js操作两个json数组合并、去重,以及删除某一项元素
2020/09/22 Javascript
[01:24]2014DOTA2 TI第二日 YYF表示这届谁赢都有可能
2014/07/11 DOTA
[01:03:18]DOTA2-DPC中国联赛 正赛 RNG vs Dynasty BO3 第一场 1月29日
2021/03/11 DOTA
[01:16:50]DOTA2-DPC中国联赛 正赛 Phoenix vs CDEC BO3 第一场 3月7日
2021/03/11 DOTA
Python文件夹与文件的相关操作(推荐)
2016/07/25 Python
python3学习笔记之多进程分布式小例子
2018/02/13 Python
python实现读Excel写入.txt的方法
2018/04/29 Python
详解用python自制微信机器人,定时发送天气预报
2019/03/25 Python
Python3 执行Linux Bash命令的方法
2019/07/12 Python
python颜色随机生成器的实例代码
2020/01/10 Python
python使用pymongo与MongoDB基本交互操作示例
2020/04/09 Python
前端canvas动画如何转成mp4视频的方法
2019/06/17 HTML / CSS
英国最大的汽车交易网站:Auto Trader UK
2016/09/23 全球购物
韩国现代百货官网:Hmall
2018/03/21 全球购物
用C#语言写出在本地创建一个UDP接收端口的具体过程
2016/02/22 面试题
共筑中国梦演讲稿
2014/04/23 职场文书
竞选班干部演讲稿600字
2014/08/20 职场文书
2015年化工厂工作总结
2015/05/04 职场文书
毕业设计致谢词
2015/05/14 职场文书