您现在的位置是：首页 >学无止境 >Taro React组件开发（8） —— RuiUploadImages 多图片上传组件【Promise.all 实现】网站首页学无止境

1. 需求分析

1. 使用 Taro.chooseImage 实现图片的选择；
2. 使用 Taro.uploadFile 实现图片的上传；
3. 由于 Taro.uploadFile API 的 filePath 只能是一张图片的路径，因此上边两个 API 只能实现单图图片上传。

2. 上传图片实现

1. 组装完整的上传接口地址【${ server_env_url }${ config.default[data.url] }】；
2. 获取上传图片的图片地址【data.file】；
3. 获取上传图片的请求头部【api.getHeader(“multipart/form-data”, data)】；
4. 上传成功，返回上传后的地址。

  // 文件上传
  uploadFileImage (data = {}) {
    data = {
      url: 'uploadSingleUrl',
      ...data
    }
    let url = `${ server_env_url }${ config.default[data.url] }`;
    return new Promise((resolve, reject) => {
      Taro.uploadFile({
        url,
        filePath: data.file,
        name: 'file'