我正在将基于Backbone.js和jQuery的单页Web应用程序迁移到Chrome扩展.但是,pushState和基于hashbang的路由器模式都不符合扩展中的环境.我得出结论,我最好只是直接渲染用户交互的观点,绕过window.location系统.但是,我不太清楚如何实现这一点,而不用在几十个文件中调用Router.navigate.
是否有可插拔/模块化的方式来保持骨干路由系统,但绕过任何url的更改?
解决方法
我真的想坚持使用Router.navigate从Backbone.js提供的路由系统中受益,而无需处理在Chrome扩展中使用的hashbang错误(例如,包括斜线被覆盖的路由),您可以使路由器.导航直接加载url,跳过整个pushState体操.
这实际上很容易完成:
Router = Backbone.Router.extend({ navigate: function (url) { // Override pushstate and load url directly Backbone.history.loadUrl(url); },// Put routes here routes: { } });
然后,您可以调用Router.navigate(url)加载新路由而不改变历史,甚至将操作绑定到包含数据骨干属性的每个链路(例如< a href =“login”data-backbone> Login& a>)与这样的事件:
$(function(){ // Initialize router Router = new Router; Backbone.history.start(); // Bind a[data-backbone] to router $(document).on('click','a[data-backbone]',function(e){ e.preventDefault(); Router.navigate( $(this).attr('href') ); }); });