javascript - _.bindAll 在渲染 Backbone View 时不工作

Question

除了处理其上下文之外，我还试图理解主干 bindAll 函数。在这种情况下，以下实现不起作用。

1. 创建一个 View 以从列表中插入数据。

2. _.bindAll(this, 'render'); 你能看出函数中this的上下文吗？ $(this.el) 是 undefined。它不应该使用 _bindAll 吗？

3. 以下不追加到ol列表

   $(this.el).append('idCurso->', cursoModelo.get('idCurso'),' titulo-> ', cursoModelo.get('titulo'));
   $(this.el).append('hola caracola');`. 
   

HTML

<ol id="ListaLibros"/>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>

JS

// create a view to print the model data in the html
var ListaLibrosView = Backbone.View.extend({
  el: '#ListaLibros',
  initialize: function() {
    this.collection = cursoCollection;

    _.bindAll(this, 'render');

    this.render();
  },
  render: function() {
    console.log("funcion render");
    var listaLibrosLi = '';

    this.collection.each(function(cursoModelo) {
      $(this.el).append('idCurso->', cursoModelo.get('idCurso'), ' titulo-> ', cursoModelo.get('titulo'));
      $(this.el).append('hola caracola');
    });
  }
});

Answer 1

您不是在 render 中直接使用 this.el，而是在 _.each() 回调中使用，这是另一个在不同的上下文中发挥作用。您需要确保它也具有相同的上下文，您可以像 _.each(function(){}, this) 一样简单地实现它，因为它接受上下文作为第二个参数。

或者，如果您使用的是 ES6，则可以使用箭头函数作为回调，它不会像 _.each(i => {}) 那样创建新上下文