vue检测对象和数组的变化分析


Posted in Javascript onJune 30, 2018

在 JavaScript 中对象和数组是引用类型,指向同一个内存空间,如果 prop 是一个对象或数组,在子组件内部改变它会影响父组件的状态。可以直接在子组件修改对象或数组,但是并不会数据改变就会引起变化。

检测对象变化

1、不能检测到对象属性的添加或删除

var vm = new Vue({
 data:{
   data111:{
     a = 1
   }
 }
})

data111.a = 2;//这个可以引起变化

但data111.b = 2;和vm.b = 2这个不能检测到变化

需要用

Vue.set(object, key, value)

比如$set(data111, b, 2);

或者:

$set(key,value)

比如vm.$set(‘b', 2);

检测数组变化

下面两种情况不能检测到变化:

1、直接通过索引设置元素,如arr[0]=12;

2、直接修改数组的长度,如vm.arr.length

Vue.set( object, key, value )

用法:

this.$set(this.arr,0,12)

Javascript 相关文章推荐
Web版彷 Visual Studio 2003 颜色选择器
Jan 09 Javascript
Jquery刷新页面背景图片随机变换的实现方法
Mar 15 Javascript
JavaScript实现简单的时钟实例代码
Nov 23 Javascript
js中继承的几种用法总结(apply,call,prototype)
Dec 26 Javascript
table行随鼠标移动变色示例
May 07 Javascript
jQuery插件animateSlide制作多点滑动幻灯片
Jun 11 Javascript
js 获取经纬度的实现方法
Jun 20 Javascript
jQuery根据name属性进行查找的用法分析
Jun 23 Javascript
Bootstrap modal 多弹窗之叠加引起的滚动条遮罩阴影问题
Feb 27 Javascript
十个免费的web前端开发工具详细整理
Sep 18 Javascript
微信小程序多列表渲染数据开关互不影响的实现
Jun 05 Javascript
vue调用本地摄像头实现拍照功能
Aug 14 Javascript
浅析vue.js数组的变异方法
Jun 30 #Javascript
详解vue添加删除元素的方法
Jun 30 #Javascript
vue.js删除列表中的一行
Jun 30 #Javascript
vue v-model动态生成详解
Jun 30 #Javascript
vue-router+nginx 非根路径配置方法
Jun 30 #Javascript
Vue项目中添加锁屏功能实现思路
Jun 29 #Javascript
angular6.0开发教程之如何安装angular6.0框架
Jun 29 #Javascript
You might like
linux php mysql数据库备份实现代码
2009/03/10 PHP
php foreach、while性能比较
2009/10/15 PHP
php实现获取及设置用户访问页面语言类
2014/09/24 PHP
基于jQuery的仿flash的广告轮播代码
2010/11/04 Javascript
超酷的网页音乐播放器DewPlayer使用方法
2010/12/18 Javascript
js播放wav文件(源码)
2013/04/22 Javascript
jQuery实现彩带延伸效果的网页加载条loading动画
2015/10/29 Javascript
JS实现星星评分功能实例代码(两种方法)
2016/06/09 Javascript
使用jQuery调用XML实现无刷新即时聊天
2016/08/07 Javascript
微信小程序 wxapp内容组件 text详细介绍
2016/10/31 Javascript
ES6解构赋值实例详解
2017/10/31 Javascript
使用vue-infinite-scroll实现无限滚动效果
2018/06/22 Javascript
axios向后台传递数组作为参数的方法
2018/08/11 Javascript
使用layer.msg 时间设置不起作用的解决方法
2019/09/12 Javascript
Vue.extend 编程式插入组件的实现
2019/11/18 Javascript
JS数组方法reverse()用法实例分析
2020/01/18 Javascript
深入了解Python中pop和remove的使用方法
2018/01/09 Python
ubuntu安装sublime3并配置python3环境的方法
2018/03/15 Python
攻击者是如何将PHP Phar包伪装成图像以绕过文件类型检测的(推荐)
2018/10/11 Python
python数据挖掘需要学的内容
2019/06/23 Python
使用虚拟环境打包python为exe 文件的方法
2019/08/29 Python
利用CSS3实现毛玻璃效果示例源码
2016/09/25 HTML / CSS
html5中localStorage本地存储的简单使用
2017/06/16 HTML / CSS
丝芙兰香港官网:Sephora香港
2018/03/13 全球购物
消防先进事迹材料
2014/02/10 职场文书
家长会主持词开场白
2014/03/18 职场文书
精彩广告词大全
2014/03/19 职场文书
经理秘书求职自荐信范文
2014/03/23 职场文书
学生会副主席竞聘书
2014/03/31 职场文书
班训口号大全
2014/06/18 职场文书
《卖火柴的小女孩》教学反思
2016/02/19 职场文书
创业计划书之家教托管
2019/09/25 职场文书
MySQL学习之基础操作总结
2022/03/19 MySQL
SQL Server数据库基本概念、组成、常用对象与约束
2022/03/20 SQL Server
阿里云服务器部署RabbitMQ集群的详细教程
2022/06/01 Servers
DQL数据查询语句使用示例
2022/12/24 MySQL