backbone.js объект вложенной модели, не уникальный для экземпляра

#javascript #jquery #backbone.js

#javascript #jquery #backbone.js

Вопрос:

У меня есть родительская модель, которая по умолчанию имеет и вложенную модель. Сама вложенная модель имеет PropertyA , которая является объектом с defaultValue и userValue . Идея заключается в том, что каждый экземпляр родительской модели поставляется с вложенной моделью, которая имеет пользовательское значение null и статическое значение по умолчанию.

Проблема в том, что когда я обновляю значение пользователя для одного экземпляра, оно в конечном итоге изменяется для всех последующих экземпляров. Вместо обновления пользовательского значения для конкретного экземпляра я делаю что-то не так и обновляю вложенную модель «прототип».

Приведенный ниже код доступен по адресу http://jsfiddle.net/GVkQp/4 /. Спасибо за помощь.

 var ParentModel = Backbone.Model.extend({
    initialize: function(){
        var defaultObjs = {
            nestedModel : new NestedModel()
        };
        $().extend(this.attributes, defaultObjs);
    }
});


var NestedModel = Backbone.Model.extend({
    defaults: {
        "propertyA" : {
                        "defaultValue" : "ABC",
                        "userValue": null
                      }
    }
});

var ParentView = Backbone.View.extend({
    initialize: function(){
        var self = this;
        var defaultValue = self.model.get("nestedModel").get("propertyA")["defaultValue"];
        var userValue = self.model.get("nestedModel").get("propertyA")["userValue"];

        var div = $("<div class='box'>defaultValue = <span id='defaultValue'>"  
                    defaultValue  "</span>, userValue = <span id='userValue'>"  
                    userValue   "</span></div>");
        var divButton = $('<input type="button" value="Change my userValue to DEF">')
            .click(function(){
            temp = self.model.get("nestedModel").get("propertyA");
            temp.userValue = "DEF";
            //wherewas my intention is just to set the userValue for a particular instance,
            //generating another instance of ParentView (by clicking button) reveals that
            //the userValue is set even for new instances.
            //How can I change it such that I only change the userValue of the particular
            //instance?

            //set value
            self.model.get("nestedModel").set({"propertyA": temp});

            //update userValue in View
            userValue = self.model.get("nestedModel").get("propertyA")["userValue"];
            $(this).parent().find("span#userValue").text(userValue);    
        });    

        //append divButtont to div
        div.append(divButton)

        //append div to body
        $('body').append(div)
    },
});

$("#add").click(function(){
    var newBoxView = new ParentView({
        model: new ParentModel()
    });
});
  

Ответ №1:

Спасибо за jsFiddle. Это прекрасно иллюстрирует вашу проблему.

Видите ли, когда вы устанавливаете свой «PropertyA» в настройках по умолчанию, создаваемый вами объект является значением по умолчанию, копируемым вместе с любым другим вложенным классом, который вы создаете. По этой причине, когда вы определяете свой defaults , у вас есть возможность определить его как функцию, чтобы каждый раз создавать новое значение по умолчанию. Если вы сделаете это, вы решите свою проблему:

 var ParentModel = Backbone.Model.extend({
    defaults: function() {
        return {nestedModel: new NestedModel()};
    }
});


var NestedModel = Backbone.Model.extend({
    defaults: function() {
        return {
        "propertyA" : {
                        "defaultValue" : "ABC",
                        "userValue": null
                      }
        };
    }
});