avalon 作用域

【avalon 作用域】的更多相关文章

作用域绑定(ms-controller, ms-important) 如果一个页面非常复杂,就需要划分模块,每个模块交由不同的ViewModel去处理.我们就要用到ms-controller与ms-important来指定ViewModel了. 我们看下面的例子: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <scr…

前端MVVM框架avalon揭秘 - HTML编译器

MVVM试图更加清晰的讲用户界面(UI)开发从应用程序的业务逻辑与行为中心分离,因为,很多这样的模式的实现都需要利用声明式数据绑定来实现讲View(视图)工作从其他层分离所以出现了一大堆自定义的声明式的语法: 如:Avalon 作用域绑定(ms-controller, ms-important) 模板绑定(ms-include) 数据填充(ms-text, ms-html) 类名切换(ms-class, ms-hover, ms-active) 事件绑定(ms-on,……) 显示绑定(ms-v…

avalon 笔记---Mr.wing

Avalon笔记步骤一:引用js文件<script src="js/avalon.js"></script>步骤二:<script> var vm = avalon.define({ $id: "wing",//用于绑定avalon的作用域各种数据及方法... }); avalon.scan();//可不加,avalon有自己的DOMReady模块,会自动扫描全文</script>步骤三:<body> &…

前端展望：取avalon，弃angular

打给比方,如果说angularJS是剑,那么avalon就是匕首.匕首比剑更易学,更快,更适合快速作战... 我们还是直接来实际的吧: 目前项目开发中有以下几个通用需求: 有前端路由系统,用来划分逻辑模块. 有异步模块载入,如requireJS或者seaJS. 数据与视图自动绑定,并且性能出众. 框架学习曲线不要太陡,并且让我的代码越少越好. 路由 AngularJS不能无缝与第三方路由整合,只能用它自己的模块,如”ui-status“.原因是AngularJS的数据模型是包裹在它的“con…

轻量级前端MVVM框架avalon - 执行流程1

基本上确定了avalon的几个重要元素的关系: M,即model,一个普通的JS对象,可能是后台传过来的,也可能是直接从VM中拿到,即VM.$json.有关的这个$json的名字还在商讨 V,即View,HTML页面,通过绑定属性或插值表达式,呈现数据,处理隐藏,绑定事件或动画等各种交互效果.V只与VM打交道. VM,即ViewModel,我们通过avalon.define("xxx", function(vm){vm.firstName = "正美"}),这里的v…

轻量级前端MVVM框架avalon - 整体架构

官网提供架构图单看这个图呢,还木有说明,感觉有点蛋疼,作者的抽象度太高了,还好在前面已经大概分析过了执行流程如图左边是View视图,我们就理解html结构,换句话就是说用户能看到的界面,渲染页面,绑定事件,切换类名,什么脏活都揽右边是ViewModel 视图模式,就是开发者通过avalon.define("xxx", function(vm){vm.firstName = "模型"}) 既然是MVVM 那么还有个M跑哪里去了,M在MVVM定义中,M只是一个过…

轻量级前端MVVM框架avalon - ViewModel

废话说了大几篇,我们开始来点干货了~ ViewModel的内部机制在MVVM中,数据是核心.而jQuery则以DOM为核心. 而DOM只是HTML在JS的世界的抽象,是一个很易变的东西.因此如果业务代码遍历选择器表达式会非常难维护.但不可否认,jQuery是操作DOM的王者,让我们操作DOM顺手拈来.但如果不让你操作DOM,不是更好吗?就像jQuery不让你用getElementById,getElementsByTagName, querySelecterAll,大家都不知道里面有多少坑,短…

轻量级前端MVVM框架avalon - 控制器

引子: 最近工作挺忙,avalon只能断断续续的写下去了,大概看了下angular的源码,看到小一半就比较难坚持了,是块硬骨头,慢慢啃吧不过angular的的文档中用词还是很优雅: HTML编译器指令编译链接过滤器注入器控制器管道等等…看起来觉得老高级,其实avalon也间接的部分实现,原理也不是很复杂 avalon版本更新很快,新版的加入了AMD规范的模块加载器,还修复了很多BUG,不过相信短期内实现的核心还是不会变化,所以我依然以现在的版本分析为主编译期视图背后的代码就…

前端MVVM框架avalon揭秘 - 双向绑定原理

avalon大家可能不熟悉,但是Knockout估计或多或少听过用过,那么说说KO的几个概念监控属性(Observables)和依赖跟踪(Dependency tracking) 声明式绑定(Declarative bindings) 模板(Templating) 本章主要提到监控属于与依赖跟踪(后改名叫计算属性) 监控顾名思义,监听着你设定目标的变化,换句话说能够通知订阅者它的改变以及自动探测到相关的依赖. 计算属性,就是依赖监控属性变化而自动调用处理更新 KO的一个例子如果你已经有…

avalon学习笔记

背景: 刚刚到一家新的公司,我新接手的项目采用的mvvm框架是avalon,当然我以前没有学过angular,但是用过react,所以对于这类框架应该不算陌生.但毕竟是一个新的框架,所以还是先学起来,俗话说得好,技多不压身嘛.据说avalon兼容性非常好,支持IE6+,无依赖,体积小,小伙伴们是不是对它更加有兴趣了呢? 目录: 关于AvalonJs 开始的例子扫描视图模型数据模型绑定作用域绑定(ms-controller, ms-important) 忽略扫描绑定(ms-skip) 模…