avalon.js路由
之前自己写了一个AJAX加载页面的方法;有时候一个页面里面会分区域加载不同的东西(div,html),但是IE的回退按钮,就失去任何意义了;
这两天研究了一下avalon.js的路由;
需要准备:
1、引入mmRouter(请将mmRouter.js、mmHistory.js这两个文件与avalon.js放在一起);
2、在页面中定义VM;
3、定义路由规则(可以参考avalon提供的API);
4、启动历史管理器;
5、开始扫描 (avalon.scan());
mmHistory是用于历史管理,它会劫持页面上所有点击链接的行为,当这些链接是以#/ 、#!/开头,就尝试匹配路由规则,阻止页面刷新(通过hash方式或HTML5的replaceState方式)。mmRouter是给我们定义路由规则,路由规则可以更精细地指定每个参数(param)的匹配规则,如果符合就执行对应的回调,如果不符合,就进入error回调。
- Hashbang模式(默认), 这个模式下所有浏览器都支持
- HTML5模式, 这个只能应用于firefox, chrome, safari,IE10+,如果浏览器不支持此特性,即使你设置avalon.history.start({html5Mode:true}),它也是在Hashbang模式下运行。
这上面两点是要注意的;
avalon 路由支持路由嵌套;路由规则支持"{}";具体可以参考官方文档