#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
}
};
}
});