0

ここにいくつかのコードがあります:

var TopPanel = Backbone.View.extend( {
    initialize: function() {
        this.listenTo(this.model, "change", this.render);
    },
    render: {
       ...
    }
});


var MyData = Backbone.Model.extend({
    initialize: function() {
    },
    defaults: {
        team: {
        level:0,
            name: "bla"
        }
    }
});

var myData = new MyData();
var topPanel = new TopPanel({model: myData});
topPanel.render();
var anotherView = new AnotherView( {model: myData} );

別のビューでは、次のようにボタンをクリックしてモデルを変更しています。

var team = this.model.get("team");
team.level = 1;
this.model.set("team", team);

別のビューでボタンを押すと、上記のようにモデルが変更されますが、topPanel ビューのレンダリング関数は呼び出されません。ただし、上記のコードを次のように変更すると: var team = this.model.get("team"); チーム = 1; this.model.set("チーム", チーム);

render 関数が呼び出されます。

これは、 backbone.js が Model の複雑なオブジェクトの変更をリッスンすることをサポートしていないということですか? もしそうなら、それを行う正しい方法は何ですか?

4

1 に答える 1

3
var team = this.model.get("team");
team.level = 1;
this.model.set("team", team);

ここではteam、あなたが思っているように、実際には属性を変更していません。あなたはそれを変更しているだけです。モデルは、JSON オブジェクトへの参照を保存します。この JSON を変更しても、参照は変更されないため、changeトリガーされるイベントはありません。this.model.set("team", team);これは、同じオブジェクト (したがって同じ参照) を再度設定しようとしているため、最後の行が実際にはまったく役に立たないことも意味します。バックボーンはその呼び出しを黙って無視します。

さて、実際に変更をトリガーするために何ができるかについて:

解決策 1:
手動でトリガーする:

this.model.get('team').level = 1;
this.model.trigger('change');

解決策 2:
新しいオブジェクトを作成します。

var team = _.clone(this.model.get('team'));
team.level = 1;
this.model.set('team', team);

どちらのソリューションでも、モデルが変更され、changeイベントがトリガーされます。

于 2013-06-03T12:57:54.340 に答える