Vue--数据代理

Object.defineProperty

const person = {}; // 创建一个新对象

person.name='xusx'

// 通过 defineProperty 使用数据描述符添加对象属性的示例

Object.defineProperty(person, "age", {

value: 37, // 默认值

writable: true, // 不可写 默认false

enumerable: true, // 是否可以枚举 默认false

configurable: true // 控制属性可否被删除

});
数据代理:get\set方法

person实际的属性值为xusx对象的属性值

复制代码
		var xusx={}
		xusx.age=30
		var person={}
		person.name="xysx"
		Object.defineProperty(person,'age',{
			get(){
				return xusx.age
			},
			set(){
				 xusx.age
			}
		})

Vue中的数据代理


Vue对象data在其属性中为_data

总结

1、通过Vue对象来代理data对象中属性的操作(读\写)

2、通过Object.defineProperty ()把data对象中所有的属性添加到Vue上,为每一个添加到Vue上的属性,都制定一个getter/setter。去操作(读、写)data中对应的属性。

数据监视

  • 1、vue会监视data中所有层次的数据
  • 2、 通过setter实现监视,在new Vue就要传入要检测的数据
  • 3、如果需给后添加的数据所响应式处理,则使用如下api:
    Vue.set(target,propertyName,value)
    注:Vue.set无法给根数据添加属性,即data下添加熟悉


相关推荐
wwlsm_zql3 分钟前
「赤兔」Chitu 框架深度解读(十二):分布式并行初始化与管理
人工智能·1024程序员节
苹果醋35 分钟前
JAVA面试汇总(二)多线程(五)
运维·vue.js·spring boot·nginx·课程设计
siriuuus7 分钟前
MySQL 慢查询日志及优化
mysql·1024程序员节
筵陌9 分钟前
MYSQL表的操作
数据库·mysql·1024程序员节
咖啡の猫14 分钟前
Vue初始化脚手架
前端·javascript·vue.js
一 乐16 分钟前
汽车销售|汽车推荐|基于SprinBoot+vue的新能源汽车个性化推荐系统(源码+数据库+文档)
java·数据库·vue.js·汽车·毕设·汽车个性化推荐
晨枫阳26 分钟前
uniapp兼容问题处理总结
前端·vue.js·uni-app
hazy1k36 分钟前
51单片机基础-红外遥控(NEC协议)
stm32·单片机·嵌入式硬件·51单片机·1024程序员节
不见长安在1 小时前
Jvm资料整理
jvm·1024程序员节
如果丶可以坑1 小时前
maven无法获取依赖问题
java·maven·1024程序员节