Question

我正在尝试在骨干网上制作简单的应用程序。实际上我想在网址更改时调用方法。我想了解骨干路由的工作原理。我研究了路由，但是当我更改网址时，我的警报不显示。当我使用“＃contacts”附加网址时，但它没有调用此方法

listContacts: function () {
          alert("route")
            console.log("route to list contacts was triggered");
            ContactsApp.List.Controller.listContacts();
        }

我们可以在点击列表中的任何项目时移动到下一页或查看。实际上我想在使用骨干路由单击行后将一个页面移动到另一个页面吗？

这是我的代码 http://plnkr.co/edit/yN16uPgk0dcJAcrApewH?p=preview

app.module("ContactsApp", function (ContactsApp, app, Backbone, Marionette, $, _) {
   // console.log(app)
    ContactsApp.Router = Marionette.AppRouter.extend({
        appRoutes: {
            "contacts": "listContacts"
        }
    });
    var API = {
        listContacts: function () {
          alert("route")
            console.log("route to list contacts was triggered");
            ContactsApp.List.Controller.listContacts();
        }
    };
    ContactsApp.on("start", function () {
        new ContactsApp.Router({
            controller: API
        });
    });
});

使用木偶的任何更新？

Answer 1

您需要使用Backbone Router。

var app = new Marionette.Application();

app.addRegions({
  'main': '#main1'
});

var Router = Backbone.Router.extend({
  routes: {
    'item(/*id)': 'item',
    '*params': 'home'
  }
});

app.router = new Router();

// Home route
app.router.on('route:home', function() {
  var page = new HomeView({...})
  app.main.show(page);
});

// Item route
app.router.on('route:item', function(id) {
  var page = new ItemView({id:id, ...})
  app.main.show(page);
});

...

app.start();
Backbone.history.start({pushState: true});

这是您的modified code。

如何将一个页面导航到另一个视图？

1 个答案: