mvvm框架实现问题记录


这里说的MVVM框架是指类似vue、avalon通过双向绑定、数据驱动的框架。

基本原理:通过defineProperties拦截数据的get,set;在dom模版加载时,扫描dom上的特殊命名的标签,生成对对应标签属性的取值函数和刷新函数;在对属性的表达式取值时,将刷新函数注册到相关联的表达式变量改变后的处理数组中,完成数据操作自动触发dom改变。

代码实现上根据http://www.cnblogs.com/Aaronjs/重写,代码稍有不一致,

代码地址:https://github.com/lukezhang001/mvvmtest

由于只是简单实现,又有参考,过程中问题不是很多,碰到的问题简单记录如下:

1、代码写完,在本地调试过程中发现js的加载状态一直是pending,问题是浏览器上看不到js文件无法断点调试,后来经过不断的排除对比,发现代码中有死循环,修改后正常

2、代码中MVVM.define的factory执行了两次,第一次执行返回的scope是普通对象,用于生成Properties的描述数组,在defineProperties后返回的model要再执行一次factory。原来是将originalModel的属性copy到model中,问题是对于函数来说,简单的copy后上下文还是原来定义的上下文,导致函数里面的vm对象还是scope,而不是model,导致属性操作有误。

3、文件中引入了observer.js,实际中并没有用到,里面代码中函数里用了很多this,而foreach会改变函数中this,所以如果foreach的函数参数用到this,一定要把最后的context参数传进去

优质内容筛选与推荐>>
1、[JAVA] 重写以及@Override标签
2、【Offer】[30] 【包含min函数的栈】
3、详解numpy的argmax
4、WCF学习笔记之传输安全
5、用css画一个倒三角


长按二维码向我转账

受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。

    阅读
    好看
    已推荐到看一看
    你的朋友可以在“发现”-“看一看”看到你认为好看的文章。
    已取消,“好看”想法已同步删除
    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送

    已发送

    朋友将在看一看看到

    确定
    分享你的想法...
    取消

    分享想法到看一看

    确定
    最多200字,当前共

    发送中

    网络异常,请稍后重试

    微信扫一扫
    关注该公众号