在本机反应中从数组上传数据到 Firebase 存储和 Firebase 数据库

Question

我有一个数组，其中包含一些图像的本地位置，如下所示。

图像路径= ["file:///data/user/0/com.app.taamoutlet/cache/react-native-image-crop-picker/22536474236950.png","file:///data/user/0/com. app.taamoutlet/cache/react-native-image-crop-picker/22583225016770.png "]

我已经上传了一张图片。 根据您在下面看到的代码，我想将图像上传到 Firebase 存储。我想将数组中的每个图像上传到一个文件夹。然后收集可下载的 URL 和每张图片，并将该信息存储在您所看到的单个产品下

      () => {
        const fs = RNFetchBlob.fs
        const uid = "flyers/" + this.state.productUid;
        const imageRef = firebase.storage().ref(uid).child(Math.random()+".jpg") //string "dp1.jpg"
        let mime = 'image/jpg'

        //------------------------------------------------
        // coverting to base64
        fs.readFile(this.state.imagePath, 'base64')
          .then((data) => {

            //console.log('data='+data);
            return Blob.build(data, { type: `${mime};BASE64` })
          })
          .then((blob) => {
            //uplaoding Image
            uploadBlob = blob
            return imageRef.put(blob, { contentType: mime })
          })
          .then(() => {
            uploadBlob.close()
            //getting url
            return imageRef.getDownloadURL()
          })
          .then((url) => {
            urls = url;
            console.log('urls=' + urls)
            //================================
            try {


              alert("Uploading Flyer" + this.state.title)

              //-------------------------------------------

              //----------Inserting Data to Database--------


              usersTable = 'flyers/' + this.state.productUid,
                console.log(usersTable)
              firebase.database().ref(usersTable).set(
                {

                  title: this.state.title,
                  description: this.state.description,
                  imageUrls: url,
                  storename: this.state.storename,
                  user: asyncValue,
                  longitude: this.state.longitude,
                  latitutde: this.state.latitutde
                }
              ).then(

                alert(this.state.title + " flyer sucessfully uploaded")
              )
              //--------------------------------------------

            }
            catch (error) {
              this.setState({ loading: false })
              this.setState({ disabled: false })
              console.log(error.toString())
              alert(error.toString())
            }
            //================================



          })
      }

Answer 1

正如 Renaud 所说，您必须使用 Promise.all。请查看此示例：

const promises = [fs.readFile(this.state.imagePath, 'base64'),...];

return Promise.all(promises).then((arrayOfResults) => {
  const furtherPromises = [...]

  return Promise.all(furtherPromises)
    .then((uploadedFiles) => {
      // action required
  })
    .catch((error) => {
      // action required
    });
  }).catch((error) => {
   // action required
});