0

我正在使用 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();
});

模型.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
    }

});

视图.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
    }


})

路由器.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
    }

})

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

4

1 回答 1

1

@TomasKirda：您可以在没有尾随括号的情况下进行更新，但我不推荐它！另外，请参见此处。

话虽如此，您已经确定了本例中的问题！

这段代码：

new appView.getView(...);

正在尝试创建一个appView.getView不是对构造函数的引用的 new （如果appView构造函数具有 property getView）。

因此，在这种情况下，您需要括号是完全正确的：

new appView().getView(...);
于 2013-05-14T15:51:11.030 回答