Aufruf von Javascript beim Rendern von Ansichten in BackBone js. Rückruf nach dem Rendern?

Mein üblichen Ansatz für diese Art der Sache ist zu verwenden setTimeout mit einem timeout von null zu arrangieren, damit etwas passiert sobald der browser erhält wieder die Kontrolle. Versuchen Sie dies:

render: function() {
    $(this.el).html(this.template({title: 'test'}));

    var _this = this;
    setTimeout(function() {
        _this.renderScatterChart();
    }, 0);

    return this;
}

Oder, wenn renderScatterChart ist bereits gebunden, um die entsprechenden this:

render: function() {
    $(this.el).html(this.template({title: 'test'}));
    setTimeout(this.renderScatterChart, 0);
    return this;
}

Können Sie auch _.aufschieben wenn Sie wollen mehr explizit über das, was Sie sind:

aufschieben _.defer(function, [*arguments])

Verzögert das aufrufen der Funktionbis der aktuelle call-stack abgeräumt hat, ähnlich wie mit setTimeout mit einer Verzögerung von 0.

So könnte man auch es so machen:

//Assuming that `renderScatterChart` is bound to the appropriate `this`...
render: function() {
    $(this.el).html(this.template({title: 'test'}));
    _(this.renderScatterChart).defer();
    return this;
}

//or if it isn't bound...
render: function() {
    $(this.el).html(this.template({title: 'test'}));

    var _this = this;
    _(function() {
        _this.renderScatterChart();
    }).defer();

    return this;
}

InformationsquelleAutor der Antwort mu is too short

Ist es, weil Sie ausführen, Rendern, bevor .el ist eingefügt in die DOM. Überprüfen Sie meine selbsterklärender code(run-in eine leere Seite mit Backbone.js im Lieferumfang enthalten):

function someThirdPartyPlugin(id){
   if( $('#' +id).length ===0  ){
    console.log('Plugin crashed');
   }else{
    console.log('Hey no hacks needed!!!'); 
   }
}

var SomeView = Backbone.View.extend({
    id : 'div1',
    render : function(){
      this.$el.append("<p>Hello third party I'm Backbone</p>");
      someThirdPartyPlugin( this.$el.attr('id') );
      return this;
  }
}); 
var SomeView2 = Backbone.View.extend({
    id : 'div2',
    render : function(){
      this.$el.append("<p>Hello third party I'm Backbone</p>");
      someThirdPartyPlugin( this.$el.attr('id') );
      return this;
  }
}); 

var myView1 = new SomeView();
$('body').append( myView1.render().el );
var myView2 = new SomeView2();
$('body').append( myView2.el );
myView2.render();

InformationsquelleAutor der Antwort Daniel Aranda

Hatte das gleiche problem wie du...habe mit highcharts. Ich war mit Rückgrat.LayoutManager, und am Ende hacken Sie den code zum hinzufügen einer postRender callback. Würde gerne sehen, diese als Teil Backbone.js

InformationsquelleAutor der Antwort Shreyas

Gut dies wurde bereits beantwortet, aber für zukünftige Referenz, ich habe dieses problem schon ein paar mal. Ich löste es durch hinzufügen benutzerdefinierte Ereignisse, in diesem Fall könnte es so etwas wie

render: function() {
  $(this.el).html(this.template({title: 'test'}));  //#1

  this.on('someView:append', function() {
      this.renderScatterChart();
  }, this);

  return this;
}

Dann, wenn ich anfügen, das element an den DOM, ich auslösen, wie

myView.trigger('someView:append');

Nun, es ist sicherlich keine schöne Lösung. Fügen Sie die Mitteilungspflicht auslösen dieses Ereignisses auf das, was ist, indem der gerenderten Ansicht auf den DOM. Je nachdem, wie Ihr code ist strukturiert, es passt besser oder schlechter. Wieder bin ich gerade dieses posting als zukünftige Referenz-und alternative.

Mehr info: http://backbonejs.org/#Events

InformationsquelleAutor der Antwort julioolvr