Question

我最近通过阅读一本书开始学习Backbonejs。我觉得这个问题有点混乱。这是一个路由器：

define(['views/index', 'views/login'], function(indexView, loginView) {

    var SelinkRouter = Backbone.Router.extend({

        currentView: null,

        routes: {
            'home': 'home',
            'login': 'login'
        },

        changeView: function(view) {
            if(null != this.currentView)
                this.currentView.undelegateEvents();
            this.currentView = view;
            this.currentView.render();
        },

        home: function() {
            this.changeView(indexView);
        },

        login: function() {
            this.changeView(loginView);
        }
    });

    return new SelinkRouter();
});

这是应用程序的启动方法：

define(['router'], function(router) {

    var initialize = function() {
        // Require home page from server
        $.ajax({
            url: '/home',          // page url
            type: 'GET',           // method is get
            dataType: 'json',      // use json format
            success: function() {  // success handler
                runApplicaton(true);
            },
            error: function() {    // error handler
                runApplicaton(false);
            }
        });
    };

    var runApplicaton = function(authenticated) {

        // Authenticated user move to home page
        if(authenticated) window.location.hash='home';
                          //router.navigate('home', true); -> not work

        // Unauthed user move to login page
        else window.location.hash='login';
             //router.navigate('login', true); -> not work

        // Start history
        Backbone.history.start();
    }

    return {
        initialize: initialize
    };
});

我的问题是runApplication部分。我读过的这本书的例子就像这样将路由器传递给了模块，但它使用了window.location.hash = "XXX"，并且根本没有触及路由器。

我认为“导航”方法会使浏览器移动到我指定的页面，但什么都没发生。为什么？

为了最佳实践，在页面（或视图）之间实现移动的最佳方法是什么？

感谢任何想法。

Answer 1

您还可以使用静态方法来避免路由器依赖（例如，在使用requirejs时）。

Backbone.history.navigate(fragment, options)

这样，你只需要：

// Start history
Backbone.history.start();

// Authenticated user move to home page
if(authenticated)
  Backbone.history.navigate('home', true);
// Unauthed user move to login page
else
  Backbone.history.navigate('login', true);

Answer 2

根据文档，如果您还想调用属于特定路线的功能，则需要传递选项trigger: true：

每当您在应用程序中达到要保存的某个点时作为URL，调用导航以更新URL。如果你愿意的话也调用route函数，将trigger选项设置为true。至更新URL而不在浏览器的历史记录中创建条目，设置替换选项为true。

您的代码应如下所示：

if(authenticated)
    router.navigate('home', {trigger: true});

创建路由器后，您还必须致电

Backbone.history.start();

<强> Backbone.history.start（[选项]）

当你的所有路由器都有   已创建，并且所有路由都已正确设置，请致电   Backbone.history.start（）开始监视hashchange事件，和   派遣路线。

最后，runApplication逻辑将类似于：

var runApplicaton = function(authenticated) {

    var router = new SelinkRouter();
    // Start history
    Backbone.history.start();

    // Authenticated user move to home page
    if(authenticated)
        router.navigate('home', true);
    // Unauthed user move to login page
    else
        router.navigate('login', true);
}

我应该使用哪一个？ Backbone.js Router.navigate和window.location.hash

2 个答案: