由于 JavaScript 的限制,Vue 不能检测以下变动的数组: 当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue 当你修改数组的长度时,例如:vm.items.length = newLength

因为vue的响应式是通过 Object.defineProperty 来实现的,但是数组的length属性是不能添加getter和setter,所有无法通过观察length来判断。

如下代码,虽然看起来数组的length是10,但是for in的时候只能遍历出0, 1, 2,导致了只有前三个索引被加上了getter 和setter

  1. var a = [0, 1, 2]
  2. a.length = 10
  3. // 只是显示的给length赋值,索引3-9的对应的value也会赋值undefined
  4. // 但是索引3-9的key都是没有值的
  5. // 我们可以用for-in打印,只会打印0,1,2
  6. for (var key in a) {
  7. console.log(key) // 0,1,2
  8. }

vue 不能监测数组长度变化length的原因的更多相关文章

  1. vue 不能检测数组长度 值变化原因解析

    1.vue不能检测数组长度或者值的变化 (1)数组长度变化 未检测到 <!DOCTYPE html> <html lang="en"> <head&g ...

  2. JavaScript 数组 length 属性获取数组长度或设置数组元素的数目

    JavaScript 数组 length 属性 JavaScript 数组 length 属性可返回或设置或组中元素的数目,语法如下: array_object.length 利用 length 属性 ...

  3. Java-Runoob-高级教程-实例-数组:03. Java 实例 – 获取数组长度-*

    ylbtech-Java-Runoob-高级教程-实例-数组:03. Java 实例 – 获取数组长度 1.返回顶部 Java 实例 - 获取数组长度  Java 实例 本文我们将为大家介绍如何使用数 ...

  4. vue中使用v-if判断数组长度是出现length报错

    在vue中使用v-if判断数组的长度时出现报错 <el-collapse-item :key="index" v-if="data.childrens.length ...

  5. 关于 vue 不能 watch 数组变化 和 对象变化的解决方案

    原文地址:关于 vue 不能 watch 数组变化 和 对象变化的解决方案 vue 监听数组和对象的变化 vue 监听数组 vue 实际上可以监听数组变化,比如: data () { return { ...

  6. vue中改变数组的值视图无变化

    今天开发的时候遇到一个多选取消点击状态的,渲染的时候先默认都选中,然后可以取消选中,自建了一个全为true的数组,点击时对应下标的arr[index]改为false,数据改变了状态没更新,突然想起来单 ...

  7. vue计算属性无法监听到数组内部变化

    计算属性可以帮助我们简化代码,做到实时更新,不用再自己添加function去修改data. 首先看一下计算属性的基本写法(摘自官网) var vm = new Vue({ el: '#demo', d ...

  8. delphi 判断一个数组的长度用 Length 还是 SizeOf ?

    判断一个数组的长度用 Length 还是 SizeOf ?最近发现一些代码, 甚至有一些专家代码, 在遍历数组时所用的数组长度竟然是 SizeOf(arr); 这不合适! 如果是一维数组.且元素大小是 ...

  9. 判断一个数组的长度用 Length 还是 SizeOf ?

    最近发现一些代码, 甚至有一些专家代码, 在遍历数组时所用的数组长度竟然是 SizeOf(arr); 这不合适! 如果是一维数组.且元素大小是一个字节, 这样用看不出错误, 譬如: var   arr ...

随机推荐

  1. Linux命令之passwd、chpasswd

    (1).命令passed passwd [-k] [-l] [-u [-f]] [-d] [-e] [-n mindays] [-x maxdays] [-w warndays] [-i inacti ...

  2. 【BZOJ 1052】 1052: [HAOI2007]覆盖问题 (乱搞)

    1052: [HAOI2007]覆盖问题 Description 某人在山上种了N棵小树苗.冬天来了,温度急速下降,小树苗脆弱得不堪一击,于是树主人想用一些塑料薄 膜把这些小树遮盖起来,经过一番长久的 ...

  3. Sd - JavaBase问题

    1. Java有哪些基本数据类型 2. Java基本数据类型和引用类型的区别 3. Java的多态 4. Override和Overload的区别 5. Java内部类 6. 继承和组合的比较 7. ...

  4. BZOJ 4031 [HEOI2015]小Z的房间(Matrix-Tree定理)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=4031 [题目大意] 你突然有了一个大房子,房子里面有一些房间. 事实上,你的房子可以看 ...

  5. 【数论】【快速幂】【扩展欧几里得】【BSGS算法】bzoj2242 [SDOI2011]计算器

    说是BSGS……但是跟前面那题的扩展BSGS其实是一样的……因为模数虽然是质数,但是其可能可以整除a!!所以这两者其实是一样的…… 第一二种操作不赘述. #include<cstdio> ...

  6. 【强联通分量缩点】【Tarjan】bzoj1051 [HAOI2006]受欢迎的牛

    就是看是否有一些点,从其他任何点出发都可到达 定理:有向无环图中唯一出度为0的点,一定可以由任何点出发均可达. 所以缩点,若出度为零的点(强联通分量)唯一,则答案为该强联通分量中点的度数. 若不唯一, ...

  7. 十一. 图形、图像与多媒体4.Graphics类的绘图方法

    Graphics类提供基本绘图方法,Graphics2D类提供更强大的绘图能力.本节讲解Graphics类,下节讲解Graphics2D. Graphics类提供基本的几何图形绘制方法,主要有:画线段 ...

  8. iOS 11 安全区域适配

    //解决iOS11,仅实现heightForHeaderInSection,没有实现viewForHeaderInSection方法时,section间距大的问题 [UITableView appea ...

  9. mqtt 协议之 PINGREQ, PINGRESP

    mqtt 协议里最简单的是 ping 协议吧 (心跳包), ping 协议是已连接的客户端发往服务端, 告诉服务端,我还"活着" PINGREQ - PING request fi ...

  10. AppCan入门教程

    主干 主干可以认为是整个页面的整体框架布局 上图是截取与ZAKER(原生开发).正益无线(HTML5开发).ZAKER微博界面(原生开发)和HTML5中国(HTML5开发).参考上述界面我们看到大部分 ...