在提取后,我在将从服务器接收到的 JSON 数据与我的 View 同步时遇到问题。
我没有“mainmodel”的集合,因为我一次只使用一个“mainmodel”,但有很多“mymodel”,无论如何,结构如下:
var mymodel = Backbone.Model.extend({
defaults: {k1:"",
k2:"",
k3:""}
});
var collection = Backbone.Collection.extend({model:mymodel,});
var mainmodel = Backbone.Model.extend({
defaults: {v1:"",
v2:"",
v3:"",
v4:new collection()
});
我从父 View 中的渲染函数创建“mymodel”的嵌套 View 。仅当我使用新模型时,这才有效。
// My ParentView render function
render: function() {
for (var i = 0; i < this.model.v4.length;i++) {
var view = new MyModelView({model:this.model.v4.at(i)});
this.$el.append($(view.render().el));
}
this.$el.append(this.template(this.model.toJSON()));
return this;
},
// The MyModelView render function below
render: function() {
this.$el.html(this.template(this.model.toJSON()));
return this;
},
现在,如果我打开应用程序并从那里创建模型,上述内容就可以工作。然而,如果我打开我的应用程序并提供一个 id,我会获取服务器,检索数据,并创建一个新的 ParentView,我最终会收到一个错误,提示“this.model.v4.at 不是函数”。呃。
现在,如果我将第一个渲染函数更改为,将 at(i) 更改为 [i]
var view = new MyModelView({model:this.model.v4[i]});
并将第二个渲染函数更改为:
,删除 toJSON this.$el.html(this.template(this.model));
它呈现。但我仍然无法在没有错误的情况下移动 View 。没有惊喜。 我使用过 console.log(JSON.stringify(this.model));当它们到达parentView和MyModelView时。返回的 JSON 看起来像这样,无论是获取的还是创建的。
{"v1":"val1",
"v2":"val2,
"v3":"val3",
"v4":[{"k1":"key1","k2":"key2","k3","key"}, { ... }, { ... }]
}
JSON 数据结构看起来是相同的。我认为 JSON 格式不正确,所以我在将模型传递给 View 之前尝试使用 JSON.parse,但这不起作用。也许我离得很远,但我最初以为我有 JSON 格式问题,但现在我不知道。服务器正在以“application/json”形式返回内容。
编辑:v1、v2、v3 的 JSON 值正确呈现。
有什么想法吗?
最佳答案
您有两个问题:一个您知道,一个您不知道。
您知道的问题是您的 mainmodel
不会自动将您的 v4
JSON 转换为集合,因此您最终会得到一个您期望的数组收藏。您可以通过添加 parse
来解决此问题到您的主模型
:
parse: function(response) {
if(response.v4)
response.v4 = new collection(response.v4);
return response;
}
你不知道的问题是你的mainmodel
中的defaults
有一个隐藏的引用共享问题:
var mainmodel = Backbone.Model.extend({
defaults: {
//...
v4: new collection()
}
});
您在 Backbone.Model.extend
对象中定义的任何内容最终都会出现在模型的原型(prototype)上,因此整个 defaults
对象由模型的所有实例共享。此外,Backbone 会将默认值
浅拷贝到您的新模型中。因此,如果您 m1 = new mainmodel()
和 m2 = new mainmodel()
,则 m1
和 m2
将具有完全相同的 v4
属性。您可以通过使用 defaults
的函数来解决此问题:
var mainmodel = Backbone.Model.extend({
defaults: function() {
return {
v1: '',
v2: '',
v3: '',
v4: new collection()
};
}
});
关于javascript - 主干 View 无法使用获取的 json,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13042787/