0

我正在尝试学习 Backbone,但我对如何使用 Handlebars 有疑问。

我想构建一个模块化应用程序,其中有用于视图和模板的单独文件。

这是我的 app.js:

define([
  // Application.
  "app",
  "views/home",
],
function(app, homeView){
    var Router = Backbone.Router.extend({
routes: {
  "": "index",
  "home": "home"
},

index: function() {
    console.log('hello');
},
home: function() {
    console.log('home');
    homeView.render();
}
});
return Router;
});

此时我正在控制台上“回家”。

这是views/home.js

define([
  'app',
  'text!templates/home.html'
], function(app, homeTxt) {
    var homeView = Backbone.View.extend({
    el: $('#main'),
        render: function(){
           console.log('render');
           var data  = { property : "1" };

           this.template = Handlebars.compile(homeTxt);

           this.el.append( this.template() );
        }
     });

   return new homeView;
});

现在我应该在控制台上得到“渲染”,但我没有得到它,并且“templates/home.html”处的模板没有被渲染。

我在控制台或 DOM 上也没有收到任何错误。

4

1 回答 1

1

我认为您需要在调用渲染之前实例化视图 -

home: function() {
    var viewInstance = new homeView();
    console.log('home');
    viewInstance.render();
}

许多 Backbone 代码示例通过不使用大写字母来指示应该实例化的事物(即用“new”调用)来帮助这种混淆,反之亦然。

于 2012-10-13T13:23:49.710 回答