backbone.js未捕获的TypeError:无法读取null的属性“View”

时间:2013-07-26 22:55:17

标签: backbone.js requirejs uncaught-exception

当我在NetBeans 7.3.1中运行我的主干应用程序时,主页面显示几秒钟,可能是5或6,然后在NetBeans输出中我看到以下内容......

Uncaught TypeError: Cannot read property 'View' of null (18:43:36:307 | error, javascript)
    at  (js/views/HomeView.js:6:28)
    at d.execCb (js/libs/require/require.js:27:197)
    at o (js/libs/require/require.js:10:471)
    at  (js/libs/require/require.js:12:184)
    at o (js/libs/require/require.js:12:75)
    at  (js/libs/require/require.js:14:1)
    at o (js/libs/require/require.js:12:75)
    at l (js/libs/require/require.js:12:336)
    at g.finishLoad (js/text.js:10:192)
    at g.load (js/text.js:10:354)
    at window.undefined.window.navigator.window.document.c.onreadystatechange (js/text.js:7:30)
Uncaught TypeError: Cannot read property 'Model' of null (18:43:36:317 | error, javascript)
    at  (js/models/Member.js:6:26)
    at d.execCb (js/libs/require/require.js:27:197)
    at o (js/libs/require/require.js:10:471)
    at x (js/libs/require/require.js:15:186)
    at m (js/libs/require/require.js:15:207)
    at g.completeLoad (js/libs/require/require.js:21:388)
    at d.onScriptLoad (js/libs/require/require.js:27:490)
Uncaught Error: Load timeout for modules: text!templates/homeTemplate.html 
http://requirejs.org/docs/errors.html#timeout (18:43:38:511 | error, javascript)
    at N (js/libs/require/require.js:7:217)
    at A (js/libs/require/require.js:16:230)
    at  (js/libs/require/require.js:16:394)

看起来RequireJS无法加载Backbone。这是main.js ...

// Filename: main.js

require.config({
    shim: {
        underscore: {
            exports: '_'
        },
        backbone: {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        }
    },
    paths: {
        jquery: 'libs/jquery/jquery-min',
        underscore: 'libs/underscore/underscore-min',
        backbone: 'libs/backbone/backbone-min',
        templates: '../templates'
    }
});

require([
    'app',

], function(App) {
    App.initialize();
});

我完全在转动轮子。为什么要求不加载Backbone?

@ Sushanth--:编辑原始帖子以包含HomeView.js

这是HomeView.js ......

define([
    'jquery',
    'underscore',
    'backbone',
    'text!templates/homeTemplate.html'
], function($, _, Backbone, homeTemplate) {

    var HomeView = Backbone.View.extend({

        el: $("#page"),

        initialize: function() {
        },

        render: function() {
            var compiledTemplate = _.template( homeTemplate, {} );
            this.$el.html( compiledTemplate ); 
        }

    });

    return HomeView;

});

@ Sushanth--:我正在使用router.js ...

进行渲染
// Filename: /js/router.js

define([
    'jquery',
    'underscore',
    'backbone',
    'views/HomeView',
    'views/MembersView'
], function($, _, Backbone, HomeView, MembersView) {

  var AppRouter = Backbone.Router.extend({
    routes: {
      // Define some URL routes
      'members': 'showMembers',
      // Default
      '*actions': 'defaultAction'
    }
  });

  var initialize = function(){
      //alert('router init');
    var app_router = new AppRouter;

    app_router.on('route:showMembers', function () {
        // Like above, call render but know that this view has nested sub views which 
        // handle loading and displaying data from the GitHub API  
        var membersView = new MembersView();
    });

    app_router.on('route:defaultAction', function (actions) {
        // We have no matching route, lets display the home page 
        var homeView = new HomeView();
        homeView.render();
    });

    // Unlike the above, we don't call render on this view as it will handle
    // the render call internally after it loads data. Further more we load it
    // outside of an on-route function to have it loaded no matter which page is
    // loaded initially.
    //var footerView = new FooterView();

    //alert('hello from router.js');
    //Backbone.history.start({pushState: true, root: "/modular-backbone/"});
    //Backbone.history.start({pushState: true});
    Backbone.history.start();
    };

    return { 
        initialize: initialize
    };
});

在main.js中添加了测试提醒,app.initialize ...

require(['app'], function(App) {
    // THIS ALERT NEVER DISPLAYS!?!?!
    alert('inside main.js before app.initialize');
    App.initialize();
});

1 个答案:

答案 0 :(得分:1)

我用AMD版本替换了我的Backbone和Underscore js文件,它开始工作。