网站首页 > 技术文章 正文
第一缺点:无法检测数组的变动
由于 JavaScript 的限制,Vue 不能检测以下数组的变动,这个限制指的是Object.defineProperty无法监听数组变化:
- 当你利用索引直接设置一个数组项时,例如:vm.items[indexOfItem] = newValue;
- 当你修改数组的长度时,例如:vm.items.length = newLength;
举个例子:
那为什么push()、pop()、shift()、unshift()、splice()、sort()、reverse()这几种数组方法却没问题呢?
官方解释:Vue 将被侦听的数组的变异方法进行了包裹,所以它们也将会触发视图更新。
怎么包裹?其实就是改写了,采用hack,实施奇技淫巧:
修改效果,也就是把字符串push指向方法Array.prototype.push,其他以此类推:字符串->方法
第二缺点:只能劫持对象的属性
案例:
Object.defineProperty只能劫持对象的属性,即key,在obj2中,num和text属于value里面的属性,而Object.defineProperty无法劫持value,也就无法跟踪num和text的变化。简单一点就是:当属性的值是引用的时候,Object.defineProperty不起作用。
怎么办?递归,深度遍历。
欢迎关注。
猜你喜欢
- 2024-10-12 学习Vue的数据绑定语法,实现动态的用户界面(四)
- 2024-10-12 Vue前端框架:绑定单个复选框。 vue复选框默认选中
- 2024-10-12 vue2响应式原理 vue2.0响应式原理
- 2024-10-12 vue数据绑定语法 vue样式绑定语法
- 2024-10-12 【Vue】第5章 Vue数据绑定和计算属性详解
- 2024-10-12 Vue数据及事件绑定、filter过滤器
- 2024-10-12 Vue开发:组件绑定自定义事件及其应用
- 2024-10-12 vue.js实战之表单绑定-单选按钮 vue表格单选
- 2024-10-12 跟神一起学前端-初识vue、数据绑定
- 2024-10-12 vue.js 动态绑定class的几种方式 vue动态绑定类
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- oraclesql优化 (66)
- 类的加载机制 (75)
- feignclient (62)
- 一致性hash算法 (71)
- dockfile (66)
- 锁机制 (57)
- javaresponse (60)
- 查看hive版本 (59)
- phpworkerman (57)
- spark算子 (58)
- vue双向绑定的原理 (68)
- springbootget请求 (58)
- docker网络三种模式 (67)
- spring控制反转 (71)
- data:image/jpeg (69)
- base64 (69)
- java分页 (64)
- kibanadocker (60)
- qabstracttablemodel (62)
- java生成pdf文件 (69)
- deletelater (62)
- com.aspose.words (58)
- android.mk (62)
- qopengl (73)
- epoch_millis (61)
本文暂时没有评论,来添加一个吧(●'◡'●)