vue的数据代理
1. vue数据代理: data对象的所有属性的操作(读/写)由vm对象来代理操作
2. 好处: 通过vm对象就可以方便的操作data中的数据
3. 实现:
1). 通过Object.defineProperty(vm, key, {})给vm添加与data对象的属性对应的属性
2). 所有添加的属性都包含get/set方法
3). 在get/set方法中去操作data中对应的属性 属性描述符:
1.数据描述符
configurable:是否可以重新定义
enumerable:是否可以枚举
value:初始值
writable:是否可以修改属性值
2.访问描述符
get:是一个回调函数,根据其他相关的属性动态计算得到当前属性值
set:也是一个回调函数,监视当前属性值的变化,更新其他相关的属性值
vue的数据代理的更多相关文章
- 8_vue是如何进行数据代理的
在了解了关于js当中的Object.defineProperty()这个方法后,我们继续对vue当中的数据代理做一个基于现在的解析 建议观看之前先了解下js当中的Obejct.defineProper ...
- vue中的数据代理原理
const vm = new Vue({ data:{ name:'boos' } }) // 注意 :使用构造函数构建vue实例时,传入的是一个option对象,它包含了data,computed等 ...
- es6中的Proxy和vue中的数据代理的异同
1:概述 1-1:Proxy 用于修改某些操作的默认行为,Proxy可以说在对对象进行各种访问或者操作的时候在外层进行一层拦截,在操作之前都需要经过这种拦截.proxy返回的是一个新对象,可以通过操作 ...
- Vue学习之--------el与data的两种写法、MVVM模型、数据代理(2022/7/5)
文章目录 1.el与data的两种写法 1.1.基础知识 1.2.代码实例 1.3.页面效果 2.MVVM模型 2.1. 基础知识 2.2 .代码实例 2.3.页面效果 3.数据代理 3.1. 基础知 ...
- 对数据劫持 OR 数据代理 的研究------------引用
数据劫持,也叫数据代理. 所谓数据劫持,指的是在访问或者修改对象的某个属性时,通过一段代码拦截这个行为,进行额外的操作或者修改返回结果.比较典型的是 Object.defineProperty() 和 ...
- Vue的数据响应式
getter和setter怎么用 示例代码 getter ,关键词为 get ,用于获取一个值.定义时为函数,但是使用时不用加括号. setter 用于对数据的改写 Object.defineProp ...
- 数据代理Object.defineProperty()
数据代理: 通过一个对象代理对另一个对象中属性的操作(读/写) 数据代理 Object.defineProperty() Object.defineProperty() 方法会直接在一个对象上定义一个 ...
- MVVM数据代理
MVVM数据代理 function MVVM(options) { this.$options = options || {}; var data = this._data = this.$optio ...
- 详解vue的数据binding原理
自从angular火了以后,各种mv*框架喷涌而出,angular虽然比较火,但是他的坑还是蛮多的,还有许多性能问题被人们吐槽.比如坑爹的脏检查机制,数据binding是受人喜爱的,脏检查就有点…性能 ...
随机推荐
- Hibernate3疑惑解决
1.session的get()和load()有什么区别? # get()如果没有找到持久化类返回null,有可能导致空指针异常. # load()如果没有找到持久化类直接抛出异常. ...
- C语言中函数strcpy ,strncpy ,strlcpy的用法
strcpy ,strncpy ,strlcpy的用法 好多人已经知道利用strncpy替代strcpy来防止缓冲区越界. 但是如果还要考虑运行效率的话,也许strlcpy是一个更好的方式. 1. s ...
- 深度学习之加载VGG19模型分类识别
主要参考博客: https://blog.csdn.net/u011046017/article/details/80672597#%E8%AE%AD%E7%BB%83%E4%BB%A3%E7%A0% ...
- 关于Server2008 R2日志的查看
Server 2008 r2通过 系统事件查看器 分析日志: 查看 系统 事件: 事件ID号: 审计目录服务访问 4934 - Active Directory 对象的属性被复制 4935 -复制失败 ...
- Scala面向对象03
- 基于spring reactor3构建的即时通讯api。
欢迎阅读Rmessage文档 技术栈 Rmessage是采用Reactor3,基于reactor-netty项目构建的实时消息推送api. 什么是Reactor3? Reactor 是一个用于JVM的 ...
- Java集合(4):未获支持的操作及UnsupportedOperationException
执行各种添加和移除的方法在Collection中都是可选操作的,这意味着实现类并不需要为这些方法提供实现.当我们调用这些方法时,将不会执行有意义的行为,而是通常抛出UnsupportedOperati ...
- 自动化运维:(1)认识 Shell
目录 (一)运维是什么? (二)什么是 Shell? (三)Shell的分类 (四)Shell脚本 (五)Shell的变量 (六)表达式 (七)Linux常见符号 (八)常见命令 (一)自动化运维是什 ...
- 【VS开发】C语言遍历文件夹
// StdCFIndAllFiles.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> ...
- JavaScript校验身份证,包含省份、长度、出生年月日、校验位的检测、性别、年龄
一.代码如下 let vcity = {11: '北京', 12: '天津', 13: '河北', 14: '山西', 15: '内蒙古', 21: '辽宁', 22: '吉林', 23: '黑龙江 ...