从 Django API 在 React 中获取外键对象而不是 ID答案

【问题标题】：Fetch foreign key object instead of ID in React from Django API从 Django API 在 React 中获取外键对象而不是 ID
【发布时间】：2020-03-26 22:52:36
【问题描述】：

我的 Django API 中有一个模型，它的父级有一个外键，它引用自身。我已经序列化了数据并在视图集中返回了它。它返回一个对象，其中父字段将父 ID 显示为 int。但是，我试图让它显示父级的实际值（名称和类别），以便我可以在我的 React 前端应用程序中呈现相关数据。我在下面列出了我的模型、序列化程序和视图集，以及它返回的对象，该对象显示了父字段中的父对象以及具有父 ID 的子对象。有人可以帮忙吗？

class ComponentModel(models.Model):
    name = models.CharField(max_length=50, blank=False)
    wattage = models.PositiveIntegerField(blank=True, null=True)
    category = models.CharField(max_length=13, choices=CATEGORY_CHOICES, blank=False)
    parent = models.ForeignKey(
        'self',
        blank=True,
        null=True,
        on_delete=models.CASCADE
    )

class ComponentSerializer(serializers.ModelSerializer):
    class Meta:
        model = ComponentModel
        fields = ('id', 'name', 'wattage', 'category', 'parent')

class ComponentViewSet(viewsets.ModelViewSet):
    queryset = ComponentModel.objects.all()
    serializer_class = ComponentSerializer

[
    {
        "id": 1,
        "name": "AMD",
        "wattage": null,
        "category": "cpu",
        "parent": null
    },
    {
        "id": 5,
        "name": "760K",
        "wattage": 100,
        "category": "cpu",
        "parent": 1
    }
]

【问题讨论】：

标签： django reactjs django-rest-framework

【解决方案1】：

一种方法是定义一个更简单的序列化程序，然后将其用于父级：

class ParentComponentSerializer(serializers.ModelSerializer):
    class Meta:
        model = ComponentModel
        fields = ('name', 'category')


class ComponentSerializer(serializers.ModelSerializer):
    class Meta:
        model = ComponentModel
        fields = ('id', 'name', 'wattage', 'category', 'parent')
    parent = ParentComponentSerializer(many=False)

您也可以通过以下方式使它们继承：

class BaseComponentSerializer(serializers.ModelSerializer):
    class Meta:
        model = ComponentModel
        fields = ['name', 'category']


class ComponentSerializer(serializers.ModelSerializer):
    class Meta(BaseComponentSerializer.Meta):
        fields = BaseComponentSerializer.Meta.fields + ['id', 'wattage', 'parent']
    parent = ParentComponentSerializer(many=False)

【讨论】：