Question

我正在使用require.js开发我的主干应用程序。一切都很好。我整合了路由器。在我集成我的路由器后，我收到错误说：

TypeError: appView is undefined
[Break On This Error]   

that.$el.append(new appView.getView({model:data}).render());

并且在view.js中我无法使用此行路由（我有意评论）

listTrigger:function(){
            myApp.navigate("/student");
        }

我在这里发布我的所有代码......任何人都可以建议或更正我的代码。或者告诉我我在这里做错了什么？

main.js

require.config({
    baseUrl: 'js/',
    paths:{
        'jquery'        :"lib/jquery.min",
        'underscore'    :"lib/underscore-min",
        'backbone'      :"lib/backbone-min",

        'appModel'      :"app/model/model",
        'appView'       :"app/views/view",
        'appViews'      :"app/views/views",
        'appRoute'      :"app/router/router"
    },
    shim:{
        underscore:{
            exports:"_"
        },
        backbone:{
            exports:"Backbone",
            deps:["jquery","underscore"]
        }
    }
});

require(["appRoute"], function(appRoute) {
    var myApp = new appRoute.getRoute();
    Backbone.history.start();
});

model.js

define("appModel", ['backbone'], function(Backbone){

    "use strict"

    var appModel = Backbone.Model.extend({});

    var appCollection = Backbone.Collection.extend({
            model:appModel,
            initialize:function(){
                // console.log("initialized from collection");
            }
    });

    return {
        model: appModel,
        collect:appCollection
    }

});

view.js

define("appView", ["backbone","appViews"], function(Backbone,appViews){

    "use strict"

    var appView = Backbone.View.extend({
        tagName:"li",
        template:_.template($("#listTemp").html()),
        events:{
            "click" : "listTrigger"
        },
        initialize:function(){
            this.render();
        },
        render:function(){
            return this.$el.html(this.template(this.model.toJSON()));
        },
        listTrigger:function(){
            // myApp.navigate("/student");
        }
    });

    return{
        getView: appView
    }

})

带有一些json数据的

views.js ：

define('appViews', ["backbone","appModel","appView"], function(Backbone,appModel,appView){

    "use strict";

    var students = [
                    {"name":"student1"},{"name":"student2"},
                    {"name":"student3"},{"name":"student4"},
                    {"name":"student5"},{"name":"student6"},
                    {"name":"student6"},{"name":"student8"},
                    {"name":"student9"},{"name":"student0"}]

    var appViews = Backbone.View.extend({
        el:$("#app").find('ul'),
        initialize:function(){
            this.collection = new appModel.collect(students);
            this.collection.on('reset', this.renderAll);
            this.renderAll();
        },
        render:function(){
            console.log("render called from views");
        },
        renderOne:function(){
            console.log("render one")
        },
        renderAll:function(){
            var that = this;
            this.collection.each(function(data,i){
                that.$el.append(new appView.getView({model:data}).render());
            })
        }
    });


    return {
        appViews : appViews
    }


})

router.js

define('appRoute', ["backbone","appModel","appView","appViews"], function(Backbone,appModel,appView,appViews){

    var appRouter = Backbone.Router.extend({
        routes:{
            "":"initiate"
        },
        initialize:function(){
            // console.log("called from routersssss");
        },
        initiate:function(){
            new appViews.appViews();
        }
    })


    return {
        getRoute : appRouter
    }

})

这一切都正常使用路由器。在我没有得到结果之后。我是否错误地使用路由器？

Answer 1

@TomasKirda：你可以 new-up 而没有尾随括号，但我不推荐它！另外，see here。

话虽如此，你已经在这个例子中发现了问题！

此代码：

new appView.getView(...);

正在尝试创建一个新的appView.getView，它不是对构造函数的引用（如果appView构造函数具有属性getView），那就是。

所以在这种情况下，你需要括号是正确的：

new appView().getView(...);

在骨干应用程序中集成requirejs后，（视图）无法正常工作

1 个答案: