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 相关文章推荐
让焦点自动跳转
Jul 01 Javascript
不能再简单的无闪刷新验证码原理很简单
Nov 05 Javascript
深入理解JavaScript系列(11) 执行上下文(Execution Contexts)
Jan 15 Javascript
jquery mobile实现拨打电话功能的几种方法
Aug 05 Javascript
javascript预加载图片、css、js的方法示例介绍
Oct 14 Javascript
解决vue router使用 history 模式刷新后404问题
Jul 19 Javascript
jquery实现左右轮播图效果
Sep 28 jQuery
浅谈gulp创建完整的项目流程
Dec 20 Javascript
基于vue-cli配置lib-flexible + rem实现移动端自适应
Dec 26 Javascript
JavaScript函数式编程(Functional Programming)组合函数(Composition)用法分析
May 22 Javascript
JavaScript中的this妙用实例分析
May 09 Javascript
浅谈JS的二进制家族
May 09 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
win2003服务器使用WPS的COM组件的一些问题解决方法
2012/01/11 PHP
PHP连接access数据库
2015/03/27 PHP
PHP模板引擎smarty详细介绍
2015/05/26 PHP
php对接java现实加签验签的实例
2016/11/25 PHP
Laravel服务容器绑定的几种方法总结
2020/06/14 PHP
基于jquery的多功能软键盘插件
2012/07/25 Javascript
js调用后台servlet方法实例
2013/06/09 Javascript
javascript中不提供sleep功能如何实现这个功能
2014/05/27 Javascript
JavaScript File API实现文件上传预览
2016/02/02 Javascript
浅谈jquery选择器 :first与:first-child的区别
2016/11/20 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
2017/03/29 Javascript
Angular.JS去掉访问路径URL中的#号详解
2017/03/30 Javascript
BootStrap实现文件上传并带有进度条效果
2017/09/11 Javascript
微信小程序实现倒计时调用相机自动拍照功能
2018/06/10 Javascript
react 组件传值的三种方法
2019/06/03 Javascript
Vue如何基于vue-i18n实现多国语言兼容
2020/07/17 Javascript
Vue环境搭建+VSCode+Win10的详细教程
2020/08/19 Javascript
实例讲解Python中的私有属性
2014/08/21 Python
Python 26进制计算实现方法
2015/05/28 Python
Python 文件处理注意事项总结
2017/04/10 Python
Python3基于sax解析xml操作示例
2018/05/22 Python
python爬虫之自动登录与验证码识别
2020/06/15 Python
Python中extend和append的区别讲解
2019/01/24 Python
python3.6环境安装+pip环境配置教程图文详解
2019/06/20 Python
python模拟键盘输入 切换键盘布局过程解析
2019/08/15 Python
Tensorflow读取并输出已保存模型的权重数值方式
2020/01/04 Python
python GUI框架pyqt5 对图片进行流式布局的方法(瀑布流flowlayout)
2020/03/12 Python
前端隐藏出边界内容的实现方法
2016/04/14 HTML / CSS
巴西Bo.Bô官方在线商店:经营奢侈品时尚业务
2020/03/16 全球购物
房屋出售协议书
2014/04/10 职场文书
机关作风整顿个人整改措施思想汇报
2014/09/29 职场文书
2015年环境整治工作总结
2015/05/22 职场文书
活动简报范文
2015/07/22 职场文书
2015领导干部廉洁自律工作总结
2015/07/23 职场文书
vue+iview实现手机号分段输入框
2022/03/25 Vue.js
react中useState使用:如何实现在当前表格直接更改数据
2022/08/05 Javascript