Question

我正在使用backbone.js路线，我正努力让历史工作。这是我的代码：

$(function() {  

    var AppRouter = Backbone.Router.extend({
        routes: {
           "/": "initHome",
           "home": "initHome",
           "projects": "initProjects",
           "project/:id" : "initProject"
        }
    });

    // Instantiate the router
    var app_router = new AppRouter;

    app_router.on('route:initProject', function (id) {
        // Note the variable in the route definition being passed in here
          getContent("project",id);
    });

    app_router.on('route:initProjects', function () {
          getContent("projects");
    });

    app_router.on('route:initHome', function () {
          getContent("home");
    });


    // SINGLE PAGE MAGIC
    $(document).on("click",".links",function(e) {
        var href = $(this).attr("href");
        var url =  lang + "/" + href;    
            page = $(this).attr("data-id");
        var param = $(this).attr("data-param");         
        if (typeof(param) == 'undefined') { param = ""; }  

        if(activepage != href && !main.hasClass("loadingPage")){    
            loader.show();  
            firstInit = false;
            activepage = href;
            res = app_router.navigate(url, true);
            getContent(page,param);
        }   
        return false;                           
    });

    Backbone.history.start({pushState: true, root: "/karlin/"});

});

推送状态在点击时工作正常，但是当我在浏览器中尝试返回/下一个按钮时，它不会调用getContent（）函数。我是骨干的新手，所以任何建议都会有所帮助。

Answer 1

更改此内容：res = app_router.navigate(url, true);

对此：app_router.navigate(url, {trigger: true});

我看不出有任何理由创建变量“res”。

恕我直言，你有一个令人费解的Backbone实现。我建议你的路由像这样移动到构造函数：

var AppRouter = Backbone.Router.extend({
    routes: {
       "/": "initHome",
       "home": "initHome",
       "projects": "initProjects",
       "project/:id" : "initProject"
    },

    initProject: function (id) {
    // Note the variable in the route definition being passed in here
      getContent("project", id);
    },

    initProjects: function () {
      getContent("projects");
    },

    initHome: function () {
      getContent("home");
    }
});

// Instantiate the router
var app_router = new AppRouter;

此外，如果您在Backbone文档中正确设置路线，

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

您可以使用传统链接将参数传递给路线。您还可以将if activePage语句作为帮助函数移动到路由器以更改页面。

Router.navigate适用于极少数情况。

我建议，一遍又一遍地阅读Backbone文档。我每次都学到新东西。那里有很多，Backbone已经有效地做事了。无需重新发明轮子。

希望这有帮助！

Answer 2

我第二个安德鲁的回答：你使用路由有点奇怪。

如果您有兴趣了解更多有关原因的信息，正如Andrew所说，“Router.navigate适用于极少数情况”，请阅读第32-46页：http://samples.leanpub.com/marionette-gentle-introduction-sample.pdf

这是我在Backbone.Marionette.js上的书的样本的一部分，但路由概念保持不变。特别是，您将了解默认trigger值为false的原因，以及为什么设计您的应用路由时会考虑到这一点，这会让您的应用更加出色。

骨干pushstate历史不起作用

2 个答案: