Estoy experimentando con React y estoy tratando de cargar varias imágenes en mi API en el matraz para guardarlas. Pude descubrir cómo cargar un solo archivo, pero estoy luchando para convertirlo en varios. Aquí está el código para una sola carga.
MATRAZ
@app.route('/upload', methods={"POST"}) def upload_file(): file = request.files.getlist("file") print(file) response="Whatever you wish to return" return responseREACCIONAR
export default class Test extends React.Component { constructor(props) { super(props); this.state = { }; this.handleUploadImage = this.handleUploadImage.bind(this); } handleUploadImage(ev) { ev.preventDefault(); const data = new FormData(); data.append('file', this.uploadInput.files[0]); fetch('http://localhost:5000/upload', { method: 'POST', body: data, }).then((response) => { response.json().then((body) => { }); }); } render() { return ( <form onSubmit={this.handleUploadImage}> <div> <input ref={(ref) => { this.uploadInput = ref; }} type="file" /> </div> <br /> <div> <button>Upload</button> </div> </form> ); } }Puede establecer la propiedad multiple en la input de su archivo para que pueda seleccionar varios archivos:
<input ref={(ref) => { this.uploadInput = ref; }} type="file" multiple /> Luego, podría cambiar su función handleUploadImage para que envíe todos los archivos seleccionados:
handleUploadImage(ev) { ev.preventDefault(); const data = new FormData(); for (let i = 0; i < this.uploadInput.files.length; i++) { data.append("file", this.uploadInput.files[i]); } fetch("http://localhost:5000/upload", { method: "POST", body: data, }).then((response) => { response.json().then((res) => { console.log(res); }); }); }