Question

我使用Marionette和browserify开发应用程序。当我启动我的应用程序时，任何路由都匹配。

我的应用代码：

app.js：

var App = require('./App/SaApp.js');
App.start();

SaApp.js：

var Mn = require('backbone.marionette');
var DashboardRouter = require('./modules/DashboardRouter.js');
var DashboardController = require('./modules/DashboardController.js');
var DashboardMainView = require('./modules/Dashboard/layout/DashboardMainView.js');
var Backbone = require('backbone');

var app = new Mn.Application();

app.addInitializer(function () {

    console.log ('addInitializer');

    var dashboardMainView = new DashboardMainView({
        el: '#main-view'
    });

    var dashboardRouter = new DashboardRouter({
        controller: new DashboardController({
            mainView: dashboardMainView
        })
    });

    dashboardMainView.render();

});

app.on("start", function(){
    Backbone.history.start();
});

module.exports = app;

DashBoardRouter.js文件：

var Mn = require('backbone.marionette');

var DashboardRouter = Mn.AppRouter.extend({
    initialize : function () {
        console.log ('router')
    },
    appRoutes: {
        "": "indexAction",
        "databases/:name":'databaseAction'
    },
});

module.exports = DashboardRouter;

和DashBoardController.js：

var Mn = require('backbone.marionette');
var _ = require('underscore');
var LeftPanelView = require('./Dashboard/views/LeftPanelView.js');
var MainPanelView = require('./Dashboard/views/MainPanelView.js');
var TablePanelView = require('./TableBoard/views/TablePanelView.js');
var TableCollection = require('./Dashboard/collection/DatabaseCollection.js');
var DatabaseModel = require('./Dashboard/model/DatabaseModel.js');

var DashboardController = Mn.Controller.extend({

    initialize : function(options) {
        this.mainView = options.mainView;
        console.log ('init')
    },

    indexAction : function() {

        var collection = new TableCollection();

        console.log ('fetch')
        collection.fetch().done(_.bind(function () {
            this.mainView.leftPanel.show(new LeftPanelView({
                tableCollection : collection
            }));

            this.mainView.mainPanel.show(new MainPanelView());
        }, this));
    },

    databaseAction : function (tableName) {
        var databaseModel = new DatabaseModel();
        databaseModel.urlRoot = 'databases/'+tableName;

        databaseModel.fetch().done(_.bind(function() {
            var tablePanelViews = new TablePanelView({
                model : databaseModel
            });

            this.mainView.mainPanel.show(tablePanelViews);
        }, this));
    },

    onRoute : function() {
        var collection = new TableCollection();
        console.log ('on route')

        collection.fetch().done(_.bind(function () {
            this.mainView.leftPanel.show(new LeftPanelView({
                tableCollection : collection
            }));
        }, this));
    }

});

module.exports = DashboardController;

当我启动我的应用程序时，所有console.log都以良好的顺序显示，但indexAction永远不会运行。当我通过browserify命令构建代码时，一切都是正确的。

感谢您的帮助。

Answer 1

我不确定，但我认为你只是错过了Approuter中的控制器（controller：myController）。正如牵线木偶文件所说：

var MyRouter = new Marionette.AppRouter({
  controller: myController,
  appRoutes: {
    "foo": "doFoo",
    "bar/:id": "doBar"
  }
});

我知道我不会在stackoverflow上发布链接，但无论如何它可能对你有所帮助。我最近做了一个基本设置与牵线木偶和要求。在那里你可以更好地理解为什么不适合你的情况：

https://github.com/LucaMele/skeleton-marionette-require-gulp

您应该在文件中找到信息：

https://github.com/LucaMele/skeleton-marionette-require-gulp/blob/master/modules/app.js 第37行（控制器：新App.Router.Controller（））

即使启动了主干历史记录，Marionette路由器也不执行任何操作

1 个答案: