Question

我尝试让我的路由器决定只显示一个登录主视图，否则显示登录视图或注册视图。

我的应用最初是localhost：8080 / indexapp。

我将它加载到data-main文件中。但我认为并没有触发与做出这一决定的行动挂钩的路线。

是否可以让路由器在加载的页面上触发路由。

另外，我有一条注释的行this.loginModel.fetch();，导致undefined不是函数错误。

    define([
    'jquery',
    'ratchet',
    'underscore',
    'backbone',

    'login/loginview',
    'login/loginmodel',
    'register/registerview',

    'home/homeview',
    ],
    function($, Ratchet, _, Backbone, LoginModel, LoginView, RegisterView, HomeView){
        var MainRouter = Backbone.Router.extend({
            routes: {
                "": "showHome",
                //"/": "showHome",

                "login": "showLogin",
                "register": "showRegister"
            },
            initialize: function(){
                Backbone.history.navigate("home", {trigger:true})
            },
            showHome: function(){
                //var self = this, loginModel = new LoginModel();
                this.loginModel = new LoginModel();
                //this.loginModel.fetch();

                if(this.loginModel.get('loginp') == true ){
                    this.homeView = new HomeView();
                    this.homeView.render();
                }
                else {
                    Backbone.history.navigate("/login", {trigger:true})
                }
                /*
                this.loginModel.fetch({
                    success: function(model){
                        if( model.get('loginp') == true ){ //show you app view for logged in users!
                            this.homeView = new HomeView();
                            this.homeView.render();
                        }
                        else { //not logged in!
                            Backbone.history.navigate("/login", {trigger:true})
                        }
                    },
                });
                */
            },
            showLogin: function(){ //display your login view
                this.loginView = new LoginView;
                //this.loginView.fetch();
                this.loginView.render();

            },
            showRegister: function(){ //display your register view
                this.registerView = new RegisterView;
                //this.registerView.fetch();

                this.registerView.render();
            },
        });

        return MainRouter;
});

loginmodel：

    define([
    'underscore',
    'backbone',
    ],
    function(_, Backbone) {
        var LoginModel = Backbone.Model.extend({

            urlRoot: '/login',
            initialize: function(){
                this.fetch();
            },
            defaults: {
                username: null,
            },

        });

        return LoginModel;
});

loginview：

define([
    'jquery',
    'ratchet',
    'underscore',
    'backbone',

    'login/loginmodel',
    'text!login/logintemplate.html',

    ],
    function($, Ratchet, _, Backbone, LoginModel, LoginTemplate){
        var LoginView = Backbone.View.extend({

            el: $('body'),

            model: new LoginModel,
            /*
            initialize: function(){
                this.model = new LoginModel;
            },
            */
            template: _.template( LoginTemplate ),

            render: function(){ //display your login view
                this.$el.html( template( this.model.attributes ) );
            },

        });

        return LoginView;
});

Answer 1

很高兴看到你关注我的想法！ ;）

你唯一缺少的就是在$（document）.ready上使用Backbone.history.start（）启动路由。

http://backbonejs.org/#Router

它以这种方式工作：您需要在调用Backbone.history.start（）之前实例化您的路由器。

因此，在您的主应用程序文件中，需要您的MainRouter，创建一个实例并启动历史记录。

$(document).ready(function(){
  new MainRouter();
  Backbone.history.start();
});

无法通过Backbone Router将逻辑路由到我的视图

1 个答案: