0

2つのビューを作成し、さまざまな状況でコレクションを変更しようとしました。this.collection.bindを設定する方法がわからないため、コレクションが変更されるたびにイベントレンダリングが発生します。

BusinessListViewビューが発火すると予想される状況は3つありますrender

  1. this.businesslist.collection = new Businesses([{ name: '1'}, { name: '2' }]);
  2. this.businesslist.set();これはthis.collection = new Businesses([{ name: '3'}, { name: '4' }]);
  3. this.search_location = new SearchLocation();これは別のビューであり、コレクションをビューに送信しますBusinessListView

1と2のコンソールにデータが表示されることを期待していましたが、機能しません。.render()を手動で追加すると、コレクションが変更されたことがわかります。これがどのように機能するか説明していただけますか?

アップデート

Alexのおかげで、これは完全に機能するソリューションです。

http://jsfiddle.net/feronovak/RAPjM/

var App = {
    run: function() {
        this.businesslist = new BusinessListView(); 
        this.businesslist.collection = new Businesses([{ name: '1'}, { name: '2' }]);
        // this.businesslist.render(); // uncomment to see collection change 
        this.businesslist.set();

        this.search_location = new SearchLocation();
    }
};

Business = Backbone.Model.extend({});
Businesses = Backbone.Collection.extend({
    model:  Business
});

BusinessListView = Backbone.View.extend({
    initialize: function(options) {
        this.collection = new Businesses();
        this.collection.bind("reset", this.render(), this);
    },
    render: function() {
        console.log(this.collection.toJSON());
    },
    set: function()
    {
        this.collection = new Businesses([{ name: '3'}, { name: '4' }]);
        // this.render(); // uncomment to see collection change 
    }
});

SearchLocation = Backbone.View.extend({
    el: "#search",
    initialize: function() {
        this.sendData();
    },
    sendData: function() {
        //  Send [{ name: '5'}, { name: '6' }] to this.businesslist  = new Businesses([{ name: '5'}, { name: '6' }]);
    }
});

$(document).ready(function(e) {
    App.run();
});
4

1 に答える 1

1

this.collection参照を別のインスタンスに設定し続けます。初期化で参照されるオブジェクトを実際にリセットすることはないため、「リセット」されません。

それ以外の:

set: function()
    {
        this.collection = new Businesses([{ name: '3'}, { name: '4' }]);
    }

試す:

set: function()
    {
        this.collection.reset([{ name: '3'}, { name: '4' }]);
    }

実行時に削除します。

this.businesslist.collection = new Businesses([{ name: '1'}, { name: '2' }]);

ここでの例:http://jsfiddle.net/aXJ9x/1/

于 2013-03-27T13:23:15.647 に答える