este es el código de carga de la imagen que la URL solo devuelve después de que el formulario se haya enviado al backend. Intentar enviar la imagen de carga a un servidor de imágenes al hacer clic en el botón, luego devolver la URL y almacenarla en el backend. Cómo hacerlo secuencialmente
const handleImgUpload = async imgb => { try { const images = imgb; let promiseArray = []; let imgbb = images.toString('base64'); const details = {image: `${imgbb}`}; let formBody = []; for (const property in details) { const encodedKey = encodeURIComponent(property); const encodedValue = encodeURIComponent(details[property]); formBody.push(encodedKey + '=' + encodedValue); } formBody = formBody.join('&'); promiseArray.push( fetch( 'https://api.imgbb.com/1/upload?key=xxxxxxxxxxxx', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8', }, body: formBody, }, ).then(r => r.json()), ); Promise.all(promiseArray) .then(values => { if (values[0].success) { let thumb = ''; values.map(imgs => { thumb = values[0].data.thumb.url; setImgUrl(imgs.data.url.replace(/["']/g, '')); }); // setImageLoader(false); //YOU SEND imgURL // handleSubmitButton(); } else { // setImageLoader(false); alert( 'An error occurred while uploading image, please check your connection and try again', ); } }) .catch(err => { // setImageLoader(false); console.log('ERORRRRR', err); alert(err); }); } catch (e) { // setImageLoader(false); console.log('ERRRR', e); }};
este es el código del botón de envío. Primero quiero obtener la URL de retorno y luego almacenarla en un estado y luego cargarla en el backend**
const handleSubmitButton = async () => { handleImgUpload(img); **handle upload function** // Show Loader setLoading(true); UserApi.ElectionReport({ imgUrl, }) .then(function (response) { // response handling setValue(response); console.log('res', response.data); if (response.data == 'successful') { // console.log('res', response.data) navigation.navigate('Home'); alert('Sent Successfully'); return; } setLoading(false); console.log('res', response.data); }) .catch(function (error) { // error handling if (error.response) { alert(error.message); setLoading(false); } });};