javascript - 主干错误 View 不是构造函数

Question

我尝试使用 Backbone 制作身份验证应用程序。

我的main.js。应用程序启动位置:

require(['backbone', './views/AppView'], function (Backbone, AppView) {
    'use strict';

    var App = new AppView();
    App.render();
);

我之前已经用 requirejs 声明了我的库。 我的 AppView.js :

define (['backbone', 'Login', './home/HomeView', './login/LoginView'], function (Backbone, Login, HomeView, LoginView) {
'use strict';

var AppView = Backbone.View.extend({

    el : 'body',

    initialize : function () {
        console.log('init Appview');
        if (Login.isConnected()) {
            //Utilisateur connecté
            this.view = new HomeView();
        }
        else{
            //Utilisateur pas connecté
            this.view = new LoginView();
        }
    },

    render : function () {
        this.$el.html(this.view.render().$el);
        return this;
    }
});
return AppView;
});

在这里我检查用户是否已连接。如果他是:AppView，如果他不是:LoginView。 目前一切正常，LoginView 出现。

登录 View :

define(['backbone', 'underscore', 'jquery', 'requirejs-tpl!./../../../../resources/templates/login/LoginTemplate.html', 'Login', './../AppView'], function (Backbone, _, $, LoginTemplate, Login, AppView) {

'use strict';

var LoginView = Backbone.View.extend({

    initialize : function () {

    },

    render : function () {
        this.$el.html(LoginTemplate());
        return this;
    },

    events : {
        'click #btnConnect' : 'connect'
    },

    connect : function (event) {

        event.preventDefault();

        var login = $('#login').val();
        var password = $('#password').val();
        var ReponseLogin = Login.login(login, password);
        if(!ReponseLogin.connected){
            //Erreur
            $('#showErreur').html(ReponseLogin.erreur);
        }
        else{
            //Pas d'erreur, on affiche l'appli, AppView
            var App = new AppView();
            App.render();
        }
    }
});

return LoginView;

});

当我尝试声明新的 AppView 以便在 HomeView 上重新加载时:“TypeError:AppView 不是构造函数”。

有人可以帮助我吗？

谢谢

Answer 1

您正在使用循环依赖 - AppView 需要 LoginView，LoginView 需要 AppView。这导致 AppView 在 LoginView 内部引用时为 null。这里有一个更好的解释:http://requirejs.org/docs/api.html#circular

您可能应该重构您的设计以消除此循环引用。如果您发现有必要，您可以在第二个模块(LoginView)中再次使用“require”并拉入AppView(如该链接所示)。但我强烈建议您重新考虑设计。