Javascript 上传图像-Django rest框架

我有2个用户模型和生态用户模型，它们的关系为1:1（我减少了本例中表格的字段）：

在其中，我使用NestedSerializer能够在单个post或put中创建和更新两个表的数据，这样我进行了更新，因为在寄存器中，我没有保留图像，我没有问题：

这是序列化程序：

class EcoUserSerializer(serializers.ModelSerializer):

 user = UserSerializer(required=True)

 class Meta:
     model = EcoUser
     fields = '__all__'

 def update(self, instance, validated_data):
     instance.document = validated_data.get('document', instance.document)
     instance.save()
     user_data = validated_data.pop('user')
     user = instance.user
     user.picture_url = user_data.get('picture_url', user.picture_url)
     user.save()
     return instance

class EcoUserViewSet(viewsets.ModelViewSet):
    serializer_class = EcoUserSerializer
    queryset = EcoUser.objects.all()
    pagination_class = None
    parser_classes = (MultiPartParser,)

    @transaction.atomic
    def update(self, request, *args, **kwargs):
        with transaction.atomic():
            try:
                instance = self.get_object()
                instance.id = kwargs.get('pk')
                serializer = EcoUserSerializer(instance=instance, data=request.data)
                print(serializer)
                if serializer.is_valid(raise_exception=True):
                    self.perform_update(serializer)
                    return Response({"status": True, "results": "Datos actualizados correctamente"},
                                    status=status.HTTP_201_CREATED)
            except ValidationError as err:
                return Response({"status": False, "error_description": err.detail}, status=status.HTTP_400_BAD_REQUEST)

const bodyFormData = new FormData();
bodyFormData.append('user.picture_url', this.params.user.picture_url.name);
bodyFormData.append('document', this.params.document);
this.axios.put(`/users/${this.params.id}/`, bodyFormData, { headers: { 'Content-Type': 'multipart/form-data' } })
  .then((response) => {
    this.isSending = false;
    this.$snackbar.open(response.data.results);
  });

在我的视图集中：

class EcoUserSerializer(serializers.ModelSerializer):

 user = UserSerializer(required=True)

 class Meta:
     model = EcoUser
     fields = '__all__'

 def update(self, instance, validated_data):
     instance.document = validated_data.get('document', instance.document)
     instance.save()
     user_data = validated_data.pop('user')
     user = instance.user
     user.picture_url = user_data.get('picture_url', user.picture_url)
     user.save()
     return instance

class EcoUserViewSet(viewsets.ModelViewSet):
    serializer_class = EcoUserSerializer
    queryset = EcoUser.objects.all()
    pagination_class = None
    parser_classes = (MultiPartParser,)

    @transaction.atomic
    def update(self, request, *args, **kwargs):
        with transaction.atomic():
            try:
                instance = self.get_object()
                instance.id = kwargs.get('pk')
                serializer = EcoUserSerializer(instance=instance, data=request.data)
                print(serializer)
                if serializer.is_valid(raise_exception=True):
                    self.perform_update(serializer)
                    return Response({"status": True, "results": "Datos actualizados correctamente"},
                                    status=status.HTTP_201_CREATED)
            except ValidationError as err:
                return Response({"status": False, "error_description": err.detail}, status=status.HTTP_400_BAD_REQUEST)

const bodyFormData = new FormData();
bodyFormData.append('user.picture_url', this.params.user.picture_url.name);
bodyFormData.append('document', this.params.document);
this.axios.put(`/users/${this.params.id}/`, bodyFormData, { headers: { 'Content-Type': 'multipart/form-data' } })
  .then((response) => {
    this.isSending = false;
    this.$snackbar.open(response.data.results);
  });

在我添加ImageField字段之前，它一直正常工作，但没有更新我的数据，我收到了一个400错误请求。我通过axios将VUEJS发送给他：

class EcoUserSerializer(serializers.ModelSerializer):

 user = UserSerializer(required=True)

 class Meta:
     model = EcoUser
     fields = '__all__'

 def update(self, instance, validated_data):
     instance.document = validated_data.get('document', instance.document)
     instance.save()
     user_data = validated_data.pop('user')
     user = instance.user
     user.picture_url = user_data.get('picture_url', user.picture_url)
     user.save()
     return instance

class EcoUserViewSet(viewsets.ModelViewSet):
    serializer_class = EcoUserSerializer
    queryset = EcoUser.objects.all()
    pagination_class = None
    parser_classes = (MultiPartParser,)

    @transaction.atomic
    def update(self, request, *args, **kwargs):
        with transaction.atomic():
            try:
                instance = self.get_object()
                instance.id = kwargs.get('pk')
                serializer = EcoUserSerializer(instance=instance, data=request.data)
                print(serializer)
                if serializer.is_valid(raise_exception=True):
                    self.perform_update(serializer)
                    return Response({"status": True, "results": "Datos actualizados correctamente"},
                                    status=status.HTTP_201_CREATED)
            except ValidationError as err:
                return Response({"status": False, "error_description": err.detail}, status=status.HTTP_400_BAD_REQUEST)

const bodyFormData = new FormData();
bodyFormData.append('user.picture_url', this.params.user.picture_url.name);
bodyFormData.append('document', this.params.document);
this.axios.put(`/users/${this.params.id}/`, bodyFormData, { headers: { 'Content-Type': 'multipart/form-data' } })
  .then((response) => {
    this.isSending = false;
    this.$snackbar.open(response.data.results);
  });

---

如果我在apppend as字段名中输入user.picture\u url，这没关系？因为它在用户对象中，然后我已经访问了picture\u url来更新它。

通过邮递员的探测，我意识到了错误：只是django表的username字段是必需的：

const bodyFormData = new FormData();
bodyFormData.append('user.picture_url', this.params.user.picture_url.name);
bodyFormData.append('document', this.params.document);
bodyFormData.append('user.username', this.params.username);

它的效果很神奇：D