客户端路由.它是如何工作的?

dan*_*ods 10 javascript client-side url-routing

我需要一个客户端路由解决方案来使用Chrome应用程序.我研究了几个和十字路口.js似乎很合适.当我将它包含在我的html文件中时,它似乎不起作用; 也就是说,如果我使用代码

crossroads.addRoute('/news/{id}', function(id){  
  alert(id);  
});   
crossroads.parse('/news/123');
Run Code Online (Sandbox Code Playgroud)

,页面提醒'123'但是如果我在浏览器的url栏中输入'/ news/321',它会预先形成浏览器的默认操作,而不是警告'321'.我究竟做错了什么.(另外,我意识到标题很广泛,但我相信我对crossroads.js的困难比crossroads.js更为普遍.这是作为一个例子给出的.)

Lay*_*yke 8

使用Hasher(由同一作者)也.

Crossroads页面上的文档告诉您需要使用Hasher,(因为它将用于监视widow.location栏.).

因此,您还需要使用Hasher并初始化它,然后您可以将"Crossroads"路线添加到Hasher以开始监控这些特定路线.

//setup crossroads
crossroads.addRoute('foo');
crossroads.addRoute('lorem/ipsum');
crossroads.routed.add(console.log, console); //log all routes

//setup hasher
hasher.initialized.add(crossroads.parse, crossroads); //parse initial hash
hasher.changed.add(crossroads.parse, crossroads); //parse hash changes
hasher.init(); //start listening for history change

//update URL fragment generating new history record
hasher.setHash('lorem/ipsum');
Run Code Online (Sandbox Code Playgroud)

http://millermedeiros.github.com/crossroads.js/


eri*_*osg 6

该命令parse告诉十字路口查看字符串并根据它执行操作.

所以在crossroads.parse('/news/123');它总是会使用的情况下/news/123.

由于您希望十字路口解析浏览器地址栏中的内容,因此您需要在解析方法中使用该值:

crossroads.parse(document.location.pathname);
Run Code Online (Sandbox Code Playgroud)

  • 或者,要包含您的查询字符串,`crossroads.parse(document.location.pathname + document.location.search)` (4认同)