Backbone.js 中的嵌套模型，如何处理 [英] Nested Models in Backbone.js, how to approach

问题描述

我从服务器获得了以下 JSON.有了这个，我想创建一个带有嵌套模型的模型.我不确定哪种方法是实现这一目标的方法.

I've got the following JSON provided from a server. With this, I want to create a model with a nested model. I am unsure of which is the way to achieve this.

//json
[{
    name : "example",
    layout : {
        x : 100,
        y : 100,
    }
}]

我希望将这些转换为具有以下结构的两个嵌套骨干模型:

I want these to be converted to two nested backbone models with the following structure:

// structure
Image
    Layout
...

所以我像这样定义布局模型:

So I define the Layout model like so:

var Layout = Backbone.Model.extend({});

但是我应该使用以下两种(如果有的话)技术中的哪一种来定义图像模型?下面是A还是B?

But which of the two (if any) techniques below should I use to define the Image model? A or B below?

A

var Image = Backbone.Model.extend({
    initialize: function() {
        this.set({ 'layout' : new Layout(this.get('layout')) })
    }
});

或者， B

var Image = Backbone.Model.extend({
    initialize: function() {
        this.layout = new Layout( this.get('layout') );
    }
});

推荐答案

我在编写 Backbone 应用程序时遇到了同样的问题.必须处理嵌入式/嵌套模型.我做了一些调整，我认为这是一个非常优雅的解决方案.

I have the very same issue while I'm writing my Backbone application. Having to deal with embedded/nested models. I did some tweaks that I thought was a quite elegant solution.

是的，您可以修改 parse 方法以更改对象中的属性，但所有这些实际上都是 IMO 非常难以维护的代码，感觉更像是一种黑客而不是解决方案.

Yes, you can modify the parse method to change a attributes around in the object, but all of that is actually pretty unmaintainable code IMO, and feels more of a hack than a solution.

以下是我对您的示例的建议:

Here's what I suggest for your example:

首先像这样定义你的布局模型.

First define your Layout Model like so.

var layoutModel = Backbone.Model.extend({});

然后这是您的图像模型:

Then here's your image Model:

var imageModel = Backbone.Model.extend({

    model: {
        layout: layoutModel,
    },

    parse: function(response){
        for(var key in this.model)
        {
            var embeddedClass = this.model[key];
            var embeddedData = response[key];
            response[key] = new embeddedClass(embeddedData, {parse:true});
        }
        return response;
    }
});

请注意，我没有篡改模型本身，只是从 parse 方法中传回了所需的对象.

Notice that I have not tampered with the model itself, but merely pass back the desired object from the parse method.

当您从服务器读取数据时，这应该确保嵌套模型的结构.现在，您会注意到这里实际上没有处理保存或设置，因为我觉得您使用正确的模型显式设置嵌套模型是有意义的.

This should ensure the structure of the nested model when you're reading from the server. Now, you would notice that saving or setting is actually not handled here because I feel that it makes sense for you to set the nested model explicitly using the proper model.

像这样:

image.set({layout : new Layout({x: 100, y: 100})})

另请注意，您实际上是通过以下方式调用嵌套模型中的 parse 方法:

Also take note that you are actually invoking the parse method in your nested model by calling:

new embeddedClass(embeddedData, {parse:true});

您可以根据需要在 model 字段中定义任意数量的嵌套模型.

You can define as many nested models in the model field as you need.

当然，如果您想将嵌套模型保存在自己的表中.这还不够.但是在整体读取和保存对象的情况下，这个方案应该足够了.

Of course, if you want to go as far as saving the nested model in its own table. This wouldn't be sufficient. But in the case of reading and saving the object as a whole, this solution should suffice.

这篇关于Backbone.js 中的嵌套模型，如何处理的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！