backback .js中hash后的斜杠

Backbone.js slash after hash in fallback - history pushState

本文关键字:hash js backback      更新时间:2023-09-26

我使用Backbone.js的路由。它为浏览器生成如下url:

http://my-app.com/help

对于Internet explorer (IE10除外)和旧的非html5浏览器:

http://my-app.com/#help

如何配置Backbone.js生成备用url与额外的斜杠,像这样?:

http://my-app.com/#/help

我知道这有点老了,但由于公认的答案不再适用于较新的Backbone版本,我想我应该分享一下我的发现。

我找到了一种在IE8和Chrome中工作的方法(没有测试任何其他浏览器)-如果你正在使用Backbone。导航历史记录。

如果你在导航调用中使用前面的两个斜杠,它将创建你想要的Url。

Backbone.history.navigate('//help');

我根本没有改变路由——它们不以斜杠开头。在那里加一个斜杠似乎把它打断了。

我还应该注意到,我使用的是木偶和主干,因为这可能会有所不同。

我相信你的第二个代码块与第三个完全不同。前面的斜杠是在属性名上设置的。

routes: {
    "help":                 "help",    // #help
    "search/:query":        "search",  // #search/kiwis
    "search/:query/p:page": "search"   // #search/kiwis/p7
  }

不同于:

routes: {
    "/help":                 "help",    // #/help
    "/search/:query":        "search",  // #/search/kiwis
    "/search/:query/p:page": "search"   // #/search/kiwis/p7
  }

这里有一个丑陋的hack来绕过它:override getHash()。以下是原始代码:

getHash: function(windowOverride) {
  var loc = windowOverride ? windowOverride.location : window.location;
  var match = loc.href.match(/#(.*)$/);
  return match ? match[1] : '';
},

在regexp中添加额外的斜杠后似乎可以工作:

Backbone.History.prototype.getHash = function(windowOverride) {
  var loc = windowOverride ? windowOverride.location : window.location;
  var match = loc.href.match(/#'/(.*)$/);
  return match ? match[1] : '';
}

导航在此之后可能无法工作,但它可能可以通过类似的hack修复。