使用 backbone-relational 创建嵌套结构
creating nested structure with backbone-relational
我正在尝试创建三个级联下拉列表。第一个包含项目,第二个包含所选项目的任务,最后一个包含所选任务的站点。
我想使用 Backbone-Relational 插件,但很难创建正确的关系。这是我第一次使用这个插件。
到目前为止的代码:
App.Models.ProjectItem = Backbone.RelationalModel.extend({
default: {
id: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'tasks',
relatedModel: App.Models.TaskItem,
//includeInJSON: Backbone.Model.prototype.idAttribute,
collectionType: App.Collections.TasksCollection,
reverseRelation: {
key: 'projectId',
//includeInJSON: Backbone.Model.prototype.idAttribute,
type: Backbone.HasOne
}
}]
});
App.Collections.ProjectsCollection = Backbone.Collection.extend({
model: App.Models.ProjectItem
});
App.Models.TaskItem = Backbone.RelationalModel.extend({
default: {
id: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'sites',
relatedModel: App.Models.SiteItem,
includeInJSON: Backbone.Model.prototype.idAttribute,
collectionType: App.Collections.SitesCollection,
reverseRelation: {
key: 'taskId',
//includeInJSON: Backbone.Model.prototype.idAttribute,
type: Backbone.HasOne
}
}]
});
App.Collections.TasksCollection = Backbone.Collection.extend({
model: App.Models.TaskItem
});
App.Models.SiteItem = Backbone.RelationalModel.extend({
default: {
id: 0,
name: ''
}
});
App.Collections.SitesCollection = Backbone.Collection.extend({
model: App.Models.SiteItem
});
正在创建单个项目:
var item = new App.Models.ProjectItem({
id: 1,
name: 'project',
tasks: [
{
id: 1,
name: 'task',
sites: [
{
id: 1,
name: 'site'
}
]
}
]
})
序列化为 json 的对象如下所示:
"{"id":1,"name":"task","tasks":[1],"sites":[{"id":1,"name":"site"}],"projectId":null}"
我的问题:
1) 为什么 sites 数组没有嵌套在任务一中?
2) 网站集的序列化方式与任务集不同。我是否也应该在站点模型中创建关系?
3) 为什么root返回projectId?
经过许多小时的试验和错误,我终于明白了。顺序很重要。。
工作代码:
App.Models.SiteItem = Backbone.RelationalModel.extend({
default: {
siteId: 0,
name: ''
}
});
App.Collections.SitesCollection = Backbone.Collection.extend({
model: App.Models.SiteItem
});
App.Models.TaskItem = Backbone.RelationalModel.extend({
default: {
taskId: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'sites',
relatedModel: App.Models.SiteItem,
//includeInJSON: Backbone.Model.prototype.idAttribute,
collectionType: App.Collections.SitesCollection,
reverseRelation: {
key: 'task',
includeInJSON: 'taskId',
type: Backbone.HasOne
}
}]
});
App.Collections.TasksCollection = Backbone.Collection.extend({
model: App.Models.TaskItem
});
App.Models.ProjectItem = Backbone.RelationalModel.extend({
default: {
projectId: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'tasks',
relatedModel: App.Models.TaskItem,
// includeInJSON: 'taskId',
collectionType: App.Collections.TasksCollection,
reverseRelation: {
key: 'project',
includeInJSON: 'projectId',
type: Backbone.HasOne
}
}]
});
App.Collections.ProjectsCollection = Backbone.Collection.extend({
model: App.Models.ProjectItem
});
示例数据:
var item = new App.Models.ProjectItem({
projectId: 2,
name: 'first',
tasks: [
{
taskId: 1,
name: 'task',
sites:[{siteId:1, name: 'site'}]
}
]
});
我得到这个 json 字符串:
"{"projectId":2,"name":"first","tasks":[{"taskId":1,"name":"task","sites":[{"siteId":1,"name":"site","task":1}],"project":2}]}"
我正在尝试创建三个级联下拉列表。第一个包含项目,第二个包含所选项目的任务,最后一个包含所选任务的站点。
我想使用 Backbone-Relational 插件,但很难创建正确的关系。这是我第一次使用这个插件。
到目前为止的代码:
App.Models.ProjectItem = Backbone.RelationalModel.extend({
default: {
id: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'tasks',
relatedModel: App.Models.TaskItem,
//includeInJSON: Backbone.Model.prototype.idAttribute,
collectionType: App.Collections.TasksCollection,
reverseRelation: {
key: 'projectId',
//includeInJSON: Backbone.Model.prototype.idAttribute,
type: Backbone.HasOne
}
}]
});
App.Collections.ProjectsCollection = Backbone.Collection.extend({
model: App.Models.ProjectItem
});
App.Models.TaskItem = Backbone.RelationalModel.extend({
default: {
id: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'sites',
relatedModel: App.Models.SiteItem,
includeInJSON: Backbone.Model.prototype.idAttribute,
collectionType: App.Collections.SitesCollection,
reverseRelation: {
key: 'taskId',
//includeInJSON: Backbone.Model.prototype.idAttribute,
type: Backbone.HasOne
}
}]
});
App.Collections.TasksCollection = Backbone.Collection.extend({
model: App.Models.TaskItem
});
App.Models.SiteItem = Backbone.RelationalModel.extend({
default: {
id: 0,
name: ''
}
});
App.Collections.SitesCollection = Backbone.Collection.extend({
model: App.Models.SiteItem
});
正在创建单个项目:
var item = new App.Models.ProjectItem({
id: 1,
name: 'project',
tasks: [
{
id: 1,
name: 'task',
sites: [
{
id: 1,
name: 'site'
}
]
}
]
})
序列化为 json 的对象如下所示:
"{"id":1,"name":"task","tasks":[1],"sites":[{"id":1,"name":"site"}],"projectId":null}"
我的问题:
1) 为什么 sites 数组没有嵌套在任务一中?
2) 网站集的序列化方式与任务集不同。我是否也应该在站点模型中创建关系?
3) 为什么root返回projectId?
经过许多小时的试验和错误,我终于明白了。顺序很重要。。 工作代码:
App.Models.SiteItem = Backbone.RelationalModel.extend({
default: {
siteId: 0,
name: ''
}
});
App.Collections.SitesCollection = Backbone.Collection.extend({
model: App.Models.SiteItem
});
App.Models.TaskItem = Backbone.RelationalModel.extend({
default: {
taskId: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'sites',
relatedModel: App.Models.SiteItem,
//includeInJSON: Backbone.Model.prototype.idAttribute,
collectionType: App.Collections.SitesCollection,
reverseRelation: {
key: 'task',
includeInJSON: 'taskId',
type: Backbone.HasOne
}
}]
});
App.Collections.TasksCollection = Backbone.Collection.extend({
model: App.Models.TaskItem
});
App.Models.ProjectItem = Backbone.RelationalModel.extend({
default: {
projectId: 0,
name: ''
},
relations: [{
type: Backbone.HasMany,
key: 'tasks',
relatedModel: App.Models.TaskItem,
// includeInJSON: 'taskId',
collectionType: App.Collections.TasksCollection,
reverseRelation: {
key: 'project',
includeInJSON: 'projectId',
type: Backbone.HasOne
}
}]
});
App.Collections.ProjectsCollection = Backbone.Collection.extend({
model: App.Models.ProjectItem
});
示例数据:
var item = new App.Models.ProjectItem({
projectId: 2,
name: 'first',
tasks: [
{
taskId: 1,
name: 'task',
sites:[{siteId:1, name: 'site'}]
}
]
});
我得到这个 json 字符串:
"{"projectId":2,"name":"first","tasks":[{"taskId":1,"name":"task","sites":[{"siteId":1,"name":"site","task":1}],"project":2}]}"