I am attempting to setState (adding an element to an array) following an async function call. However images is set with undefined. (Even though underlying function definitely returns with a value.)
How do I make sure my array is updated with value after return from async function concludes?
const [images, setImages] = useState([])
pickerResult.map(async (img) => {
await handleImageUpload(img.uri)
.then((url) => {
setImages(images => [...images, url]);
})
})
useEffect(() => {
console.log(images)
}, [images])
Array [
undefined,
undefined,
]
Try this:
const [images, setImages] = useState([])
pickerResult.map(async (img) => {
const url = await handleImageUpload(img.uri)
setImages(images => [...images, url]);
})