javascript - Backbone Marionette 没有射击路线

Question

我正在使用 Backbone 和 Marionette 创建一个简单的应用程序。它只是获取 WordPress 帖子列表(使用 API)并显示它。这是一个非常简单的应用程序，因此它没有模块化。

我有以下内容(全部放在同一个文件中):

if ( Backbone.history )
    Backbone.history.start({ pushState: false });

if ( Backbone.history.fragment === '' )
    API.listAllPosts();
else
    API.listSinglePost( Backbone.history.fragment );


// Is not firing anything from here...
MyBlog.Router =  Marionette.AppRouter.extend({
    appRoutes: {
        '': 'listPosts',
        ':post_name': 'listSingle'
    },
    listPosts: function() {
        console.log('router');
        API.listAllPosts();
    },
    listSingle: function(model) {
        console.log('router, single');
        API.listSinglePost(model);
    }
});
// ...to here

var API = {
    listAllPosts: function() {
        // Fetch all posts and display it. It's working
    },
    listSinglePost: function(model) {
        // Fetch a single post and display it. It's working
    }
}

MyBlog.addInitializer(function() {
    console.log('initializer'); // It's firing

    new MyBlog.Router({
        controller: API
    });
});

如Derick Bailey, Marionette's creator, said关于在 naviagate 上使用触发器:

it encourages bad app design and it is strongly recommended you don’t pass trigger:true to Backbone.history.navigate.

我在这里缺少什么？

Answer 1

在创建路由器实例之前启动 Backbone 历史记录。

只需将其移至创建路由器后即可。

MyBlog.addInitializer(function() {    
    new MyBlog.Router({ controller: API });

    // should be started after a router has been created
    Backbone.history.start({ pushState: false });
});

另一件事是回调 should be defined inside of a controller或者您应该将 appRoutes 更改为 routes。

The major difference between appRoutes and routes is that we provide callbacks on a controller instead of directly on the router itself. [...] As the AppRouter extends Backbone.Router, you can also define a routes attribute whose callbacks must be present on the AppRouter.