Antd上传文件实践

版本：
"react": "^16.13.1"
"antd": "^4.0.4

用antd的Form组件做了一个注册表单，注册的同时上传一个头像文件，当点击注册，所有数据包括头像一起传给后端处理。

 

需要解决两个问题：

1. 表单字段数据和图片数据要一起传给后端。

2. 后端分别处理字段数据和图片数据，图片名保存到mongodb数据库，图片保存到本地。

注：这里没有写密码校检逻辑，主要关注图片如何被上传。

注册组件

import React, { Component } from 'react';
import axios from 'axios';
import { Input, Button, Form, Upload } from 'antd';
import { UploadOutlined } from '@ant-design/icons';

class Regist extends Component {
  
  constructor(props) {
      super(props);