码迷,mamicode.com
首页 > 其他好文 > 详细

Backbone学习记录(6)

时间:2014-09-01 00:15:12      阅读:202      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   os   io   strong   ar   for   

路由

backbone将路由规则和一个方法名绑定到一起,来控制单页的hash,以及单页的前进后退。

var UserRouter = Backbone.Router.extend({

  routes: {
      "":                      "main",
    "help":                 "help",    // #help
    "search/:query":        "search",  // #search/page
    "search/:query/p:page": "search", // #search/page/p1
    "*error":                 "error", 
  },
  main:function(){
      console.log("main");
  },
  help: function() {
    console.log("help");
  },

  search: function(query, page) {
    console.log(query,page);
  },
  error:function(error){
      console.log(error,"is a error hash!");
  }
});
var user_router=new UserRouter();

Backbone.history.start();//开启前history监控hashchange


//http://localhost/backbone_test/backbone_test.html
//=> main

//http://localhost/backbone_test/backbone_test.html#help
//=> help


//http://localhost/backbone_test/backbone_test.html#search/page
//page null 

//http://localhost/backbone_test/backbone_test.html#search/page/p1
//page 1 

//http://localhost/backbone_test/backbone_test.html#other
//other is a error hash!

路由规则

search/:query中 : 表示查询,,当输入#search/page 这里的page就作为参数传给与规则search/:query绑定的函数中。

*表示匹配0或多个字符 ,如果上面的例子中没有这个"": "main"规则,url后面输入#,控制台就会显示 null "is a error hash!" ,因为 * 匹配了0个字符。
#之后的所有字符,都可以作为一个整体字符串的参数传给和该规则绑定的方法中。*也可以和:混用。比如对于规则"*search/:query/error": "error",url后面输入“#search/page/url”,“search/page/url”就作为参数传给了error方法。

Backbone.history.start()或Backbone.history.start({pushState: true})用于开启history监控,这样就能应用路由规则了。

Backbone学习记录(6)

标签:style   blog   http   color   os   io   strong   ar   for   

原文地址:http://www.cnblogs.com/qianlegeqian/p/3948327.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!