Backbone 及依赖库
- underscore
- zepto/jquery
Backbone 的特性
- 轻量级
- MVC结构化
- 继承机制
- 建立与服务器的无缝链接
- 界面事件管理
- 事件可以是任意事件
- 元素可以是满足jquery的选择器
- 后边是响应方法
- 轻量级模板解析
- 自定义事件管理
model.on('selfEvent',function(){})
model.off('selfEvent')
model.trigger('selfEvent',val1,val2...)
- 路由器
// 在 view 中
events: {
'click [role=edit]':'add'
},
add: function () {}
// 在 route 中
var CustomRouter = Backbone.Router.extend({
routes : {
'' : 'index', // 当URL Hash在根目录时执行index方法:url#
'list' : 'getList', // 当URL Hash在list节点时执行getList方法:url#list
'detail/:id' : 'query', // 当URL Hash在detail节点时执行query方法,并将detail后的数据作为参数传递给query方法:url#list/1001
'*error' : 'showError' // 当URL Hash不匹配以上规则时, 执行error方法
},
index : function() {
alert('index');
},
getList : function() {
alert('getList');
},
query : function(id) {
alert('query id: ' + id);
},
showError : function(error) {
alert('error hash: ' + error);
},
});
var custom = new CustomRouter();
Backbone.history.start();