图片上传upload

引入id,可以生成单独的哈希值

// id
import shortid from 'shortid'

上传组件ant

<Form.Item
          label="上传1"
        >
          <Upload
            listType="picture-card"
            fileList={fileList2}
            beforeUpload={beforeUpload2}
          >
            上传
          </Upload>
        </Form.Item>

上传方法:

  const beforeUpload2 = async (file) => {
    // console.log(file, 'file')
    const { size, type } = file
    if (size > 1000 * 2048) {
      message.warning('图片过大!')
      return false
    }
    if (type != 'image/png') {
      message.warning('必须是png格式')
      return false
    }
    if (fileList2.length > 1) {
      message.warning('最多上传两张')
      return false
    }
    // 二进制转换
    const formDate = new FormData()
    formDate.append('file', file)

    const imgload = await dispatch({
      type: 'form/getUpload1',
      payload: formDate
    })


    setFileList2([
      ...fileList2,
      {
        uid: shortid.generate(),
        name: 'image.png',
        status: 'done',
        url: imgload,
      },
    ]);
    return false;

  }

图片链接处理

//把url从里面取出来放到提交接口里面
img: fileList.map(dt => dt.url),

回填处理

setFileList([
      {
        uid: '-1',
        name: 'image.png',
        status: 'done',
        url: data.img[0],
      },
    ]);