バックボーン - レンダリングコレクション

Question

私はBackbonejsでアプリケーションを作成しようとしています.JQueryを除いてフロントエンドのJavascriptフレームワークを初めて使用しています。

レンダリングの仕組みがまだわかりませんでした。

私の例：

render: function() { 
 

 

 
      var events = this.collection.fetch({ 
 

 
       success: function (model, response) { 
 

 
        console.log("Response is " + response); 
 

 
        var events = model.toJSON(); 
 

 
        console.log(events.length); 
 
        console.log(model.toJSON()); 
 

 
        return model.toJSON(); 
 

 
       }, 
 
       error: function(){ 
 
        console.log("Errore during data fetch"); 
 
       } 
 
      }); 
 

 

 
      this.$el.html(this.template({events:this.collection.toJSON()})); 
 

 
      console.log("Event list: " + events.length); 
 

 
},

上記のコードは、私の見解のレンダリングコールバックです。 成功コレクションフェッチの中で私は自分のAPIからjson形式のデータを取得してコンソールに正常にログを記録しますが、フェッチ以外ではこのデータはなくなり、ビューコレクションは空のバックボーンオブジェクトのようです。

誰かが私が間違っていることやレンダリングの仕組みを説明できますか？

エンリコ:)

Answer 1

まあ、基本的に何をするかrenderそれはちょうどビューのel（要素）に一部のHTMLコードを挿入します。 handlebarsまたはmustacheなどのテンプレートエンジンを使用するか、コードで行ったように一般的なバックボーン（実際にはアンダースコア）テンプレートを使用するだけで済みます。

通常は、添付されているモデルやケースのコレクションをリッスンする方法でビューを初期化しています。 レンダリング内のデータをフェッチするのはあまり良いことではありません。フェッチされたデータだけを使用する必要があるからです。

だから、あなたは何ができるか、あなたのビューこの方法を初期化することです。このコードで

var View = Backbone.View.extend({ 
    initialize : function(){ 
    this.listenTo(this.collection, "change", this.render); 
    }, 
    redner : function(){ 
    this.$el.html(this.template({events:this.collection.toJSON()})); 
    } 
}); 

、ビューは、それに接続されたコレクションに発生した変更を待機します。私が変更を言うとき、私はコレクションが最初にフェッチされたときを含む、コレクションのいずれかのモデルへの変更を意味します。 listenToメソッドは、コレクションに変更があるたびにrenderメソッドを呼び出すので、ビュー全体が再描画されます。 これは、コレクションが最初にフェッチされたときに明らかに発生します。

それ自体をフェッチしていますか？一度youv'eビューにバインドしたchangeイベントは、ビューの中に必ずしもではなく、あなたのアプリのどこにでも取り出すことができます。