ReactJS 表单提交 this.props.history.push('/downloads') 未链接到新页面

Question

一旦用户在下面的函数中使用 this.props.history.push 填写了表单，我就会尝试推送到新页面。

  handleSubmit = async event => {
    event.preventDefault()
    try {
      const res = await newEnquiry(this.state.formData)
      this.props.history.push('/downloads')
      console.log(res)
    } catch (err) {
      console.log(err.response.data)
    }
  }

ReactJS 表单在 /contacts 页面上工作正常，并将信息提交到我的 Django 后端，所以我知道它工作正常，但是我无法让重定向工作，它给了我这个错误消息。

<form onSubmit={this.handleSubmit}> 在我的表单标签内，并且工作正常，所以我很确定我的表单没有问题。

Api.js

const baseUrl = '/api'

export const newEnquiry = formData => {
  return axios.post(`${baseUrl}/enquiries/`, formData)
}

Views.py

class EnquiryListView(APIView):

    def get(self, _request):
        enquiries = Enquiries.objects.all() 
        serialized_enquiries = EnquirySerializer(enquiries, many=True)
        return Response(serialized_enquiries.data, status=status.HTTP_200_OK)

    def post(self, request):
        created_enquiry = EnquirySerializer(data=request.data)
        if created_enquiry.is_valid():
          created_enquiry.save()
          return Response(created_enquiry.data, status=status.HTTP_201_CREATED)
        return Response(created_enquiry.errors)

序列化器.py

class EnquirySerializer(serializers.ModelSerializer):

      class Meta:
        model = Enquiries
        fields = '__all__'

Answer 1

在您遇到此问题的情况下，当错误触发时，它无法读取 err.response.data 属性。如果没有错误，它将重定向您。在您的 Django 应用程序中，检查 error handler 应该返回的内容。

try/catch 的快速回顾。

try {
 // if everything passes, run this block
} catch (err) {
 // if something goes wrong, run this block
}

在这种情况下，请务必检查您的完整错误是什么。可能是404 或完全出乎意料的东西。