MVVM数据代理
MVVM数据代理
function MVVM(options) {
    this.$options = options || {};
    var data = this._data = this.$options.data;
    var me = this;
    // 数据代理
    // 实现 vm.xxx -> vm._data.xxx
    Object.keys(data).forEach(function(key) {
        me._proxyData(key);
    });
    this._initComputed();
    observe(data, this);
    this.$compile = new Compile(options.el || document.body, this)
}
MVVM.prototype = {
    $watch: function(key, cb, options) {
        new Watcher(this, key, cb);
    },
    _proxyData: function(key, setter, getter) {
        var me = this;
        setter = setter ||
        Object.defineProperty(me, key, {
            configurable: false,
            enumerable: true,
            get: function proxyGetter() {
                return me._data[key];
            },
            set: function proxySetter(newVal) {
                me._data[key] = newVal;
            }
        });
    },
    _initComputed: function() {
        var me = this;
        var computed = this.$options.computed;
        if (typeof computed === 'object') {
            Object.keys(computed).forEach(function(key) {
                Object.defineProperty(me, key, {
                    get: typeof computed[key] === 'function'
                            ? computed[key]
                            : computed[key].get,
                    set: function() {}
                });
            });
        }
    }
};
MVVM数据代理的更多相关文章
- 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. 基础知 ... 
- vue的数据代理
		1. vue数据代理: data对象的所有属性的操作(读/写)由vm对象来代理操作2. 好处: 通过vm对象就可以方便的操作data中的数据3. 实现: 1). 通过Object.defineProp ... 
- 对数据劫持 OR 数据代理 的研究------------引用
		数据劫持,也叫数据代理. 所谓数据劫持,指的是在访问或者修改对象的某个属性时,通过一段代码拦截这个行为,进行额外的操作或者修改返回结果.比较典型的是 Object.defineProperty() 和 ... 
- ExtJs4学习(八)数据代理Proxy
		ExtJs数据代理我们介绍常用的四种,但会着重介绍ajax代理,因为日常开发中,这个最为常用 Ext.data.proxy.Ajax AjaxProxy(Ajax数据代理类)是你的应用程序中使用最广泛 ... 
- 数据代理Object.defineProperty()
		数据代理: 通过一个对象代理对另一个对象中属性的操作(读/写) 数据代理 Object.defineProperty() Object.defineProperty() 方法会直接在一个对象上定义一个 ... 
- vue中的数据代理原理
		const vm = new Vue({ data:{ name:'boos' } }) // 注意 :使用构造函数构建vue实例时,传入的是一个option对象,它包含了data,computed等 ... 
- es6中的Proxy和vue中的数据代理的异同
		1:概述 1-1:Proxy 用于修改某些操作的默认行为,Proxy可以说在对对象进行各种访问或者操作的时候在外层进行一层拦截,在操作之前都需要经过这种拦截.proxy返回的是一个新对象,可以通过操作 ... 
- 8_vue是如何进行数据代理的
		在了解了关于js当中的Object.defineProperty()这个方法后,我们继续对vue当中的数据代理做一个基于现在的解析 建议观看之前先了解下js当中的Obejct.defineProper ... 
- WPF实战案例-数据代理
		在我们wpf开发中,很多人会有mvvm模式去做wpf的项目. 是否有人遇到这样一个场景:在一个界面上,有个tabcontrol上面有4个页签,每个页签里面都有一个datagrid,里面显示的列基本一样 ... 
随机推荐
- vimium使用
			vimium使用 chrome下面的vimium插件已经慕名已久,迟迟没有做尝试,今天在家有空就熟悉了一下vimium,感觉还是棒棒的.记录一下一些使用心得. 常用按钮 j 向上滚动 k 向下滚动 d ... 
- jenkins定位GitLab推送的最新Webhook中push event来自哪一个分支
			转载请标明出处:http://www.cnblogs.com/zblade/ 一.调研目的 jenkins可以和GitLab搭档,每当GitLab上有commit的时候,都可以触发jenkins执行相 ... 
- 强化学习(六)时序差分在线控制算法SARSA
			在强化学习(五)用时序差分法(TD)求解中,我们讨论了用时序差分来求解强化学习预测问题的方法,但是对控制算法的求解过程没有深入,本文我们就对时序差分的在线控制算法SARSA做详细的讨论. SARSA这 ... 
- 树莓派播放视频的播放器omxplayer
			omxplyer为树莓派量身定做的一款GPU硬件加速的播放器,很好的解决了树莓派cpu计算力不足的缺点.(播放时cpu一定都不烫手) 1.安装方法: CTRL + ALT + T 调出终端命令行输入 ... 
- DSAPI 导出EXEDLL函数到字符串
			EXE或者DLL写好了,要开始写函数说明文档了,可是有时里面的函数太多,怎么能自动列出来呢?在DSAPI中提供了该功能(目前没有做参数类型导出,以后有时间会添加). 先准备一个已经写好的EXE或DLL ... 
- C#的一些获取时间的例子
			从周一到周日的顺序,获取排序数值: int i = DateTime.Now.DayOfWeek - DayOfWeek.Monday; if (i == -1) i = 6; 获取某日起,星期一日期 ... 
- Excel的读取和保存(POI)
			示例 Excel文件: 数据读取: 保存路径: Jar包准备 下载地址: 链接:https://pan.baidu.com/s/1RZAwEsFwjKMlnYYGwHMfaA 提取码:h9mj 文件上 ... 
- TrieTree
			学习链接:https://blog.csdn.net/lisonglisonglisong/article/details/45584721 前缀树解决字符串前缀匹配问题,查找单词是否存在,统计以如“ ... 
- PHP+nginx 启动后访问超时
			场景 在Windows上, nginx配置并启动后, 访问报504超时 解决 很尴尬, php-cgi没启动 php-cgi -b 
- Dotnetcore 开发速记
			1.System.InvalidOperationException:"Internal connection fatal error." 全球固定模式,坑爹 https://gi ... 
