在主幹應用程序中整合requirejs後，（視圖）不起作用

我正在使用require.js開發我的主幹應用程序。一切都很好。直到我整合了路由器。之後我結合我的路由器遇到錯誤說：在主幹應用程序中整合requirejs後，（視圖）不起作用

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 
    } 

})

views.js一些JSON數據：

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 
    } 

})

跨越這一切都是正確的工作最多使用路由器。在我沒有得到結果之後。我錯誤地使用路由器嗎？

來源

2013-05-13 3gwebtrain

奇怪的是看你的呼籲沒有構造括號，它就不能成爲新APPVIEW（）getView（。 ...）？另外，如果appView未定義，則appView中可能存在運行時錯誤，或者由於某種原因，模塊無法加載。 – 2013-05-14 04:14:31

@TomasKirda：你可以新的沒有後面的括號，但我不會推薦它！另外，see here。

話雖如此，在這種情況下您已經確定了問題！

此代碼：

new appView.getView(...);

試圖創建一個新的appView.getView這是不是一個構造函數的引用（這將是如果appView構造了一個屬性getView）。

因此，在這種情況下，你是完全正確的括號是必需的：

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

來源

2013-05-14 15:51:11 c24w

在主幹應用程序中整合requirejs後，（視圖）不起作用

回答

相關問題