1

我目前正在将 javascriptbone.js 视图转换为 coffeescript，但它无法正常工作。

我工作的原始 Javascript 视图是

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

  var Test = Backbone.View.extend({
    el: $("#page"),
    render: function(){
      this.$el.html(mainHomeTemplate);
    }
  });
  return Test;
});

我的咖啡脚本视图是

define [
  'jquery',
  'underscore',
  'backbone',
  'text!templates/dashboard/main.html'
], ($, _, Backbone, mainHomeTemplate) ->

Test = Backbone.View.extend
    el: $ '#page'

    render: ->
        $(@el).html @mainHomeTemplate

Test

当我尝试初始化测试视图时，我得到它说测试未定义。

app_router.on('route:defaultAction', function (actions) {
      require(['views/dashboard/testnew'], function(Test) {
        console.log(Test)
        var test = new Test();
        test.render();
       });

任何帮助将非常感激。谢谢

4

1 回答 1

3

当它只是一个普通的局部变量时，您将其引用mainHomeTemplate为实例变量（@mainHomeTemplate与 相同）。this.mainHomeTemplate你要：

Test = Backbone.View.extend
    el: $ '#page'

    render: ->
        $(@el).html mainHomeTemplate # <-------- No '@' on 'mainHomeTemplate'

当我在这里时，你应该让 Backbone 处理 jQuery 的东西，el并且你的视图已经有了@$el（假设你使用的是最新版本的 Backbone），所以你不必$(@el)：

Test = Backbone.View.extend
    el: '#page'
    render: ->
        @$el.html mainHomeTemplate

我假设您的define函数中缺少缩进也只是复制/粘贴错误；在将 CoffeeScript 代码粘贴到问题中时，您必须非常小心您在 CoffeeScript 中的缩进。你也可以使用普通的 CoffeeScript 类机制来代替Backbone.View.extend. 您的最终结果应如下所示：

define [
  'jquery',
  'underscore',
  'backbone',
  'text!templates/dashboard/main.html'
], ($, _, Backbone, mainHomeTemplate) ->

    class Test extends Backbone.View
        el: '#page'

        render: ->
            @$el.html mainHomeTemplate

    Test
于 2012-11-05T19:46:22.740 回答