javascript - 如何使用 React.js 将多个图像上传到 Firebase

标签 javascript reactjs firebase firebase-storage

使用react js,我需要将多个图像上传到firebase,我尝试使用下面的代码无法进行多个上传。

//display multi
handleChange(event) {

    const file = Array.from(event.target.files);
    this.setState({ file });   
}
//upload multi
fileuploadHandler = () => {

    const storageRef = fire.storage().ref();
    storageRef.child(`images/${this.state.file.name}`)
        .putFile(this.state.file).then((snapshot) => {

    });
  }

render() {
    return (
        <div className="App">
            <input id="file" type="file" onChange={this.handleChange.bind(this)} required multiple />
            <button onClick={this.fileuploadHandler}>Upload!</button>               
            </div>

    )

}

最佳答案

要处理多个文件,您需要循环输入的 files 属性。

所以:

const storageRef = fire.storage().ref();
this.state.file.forEach((file) => {
  storageRef
      .child(`images/${file.name}`)
      .putFile(file).then((snapshot) => {
  })
});

关于javascript - 如何使用 React.js 将多个图像上传到 Firebase,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50785465/

相关文章:

javascript - Dojo构建系统: Only build dojo when needed?

reactjs - takeEvery 和 takeLatest。为什么?什么时候使用?同时使用?

css - 用于 Typescript 的 SVG-React 组件

Firebase 部署找不到 firebase.json

javascript - 如何使用 CryptoJS AES 解密消息?我有一个工作节点加密示例

javascript - 更改 iframe 中的内容并删除不需要的元素

javascript - KML 图层未显示在 map 上

javascript - 在 React 中显示来自 API 的图像

android - 在android后台从firebase发送通知时没有通知声音和振动和灯光

android - Firebase 数据库监听器检索到错误信息