how make multiple async/await in javascripts -
I need to Execute one function as a result of another function like as chain. I explain details on my code below.
const setter = async () => {
//this my first request that puts data in property value work right and get data.
setPropertyvalue(await (getpropertvalue(slide.slide, 0)));
const lat2 = parseInt(await return_value(propertyvalue, "geolocation_lat"));
//upper two const lat2&long2 depend on setpopertyvalue
const long2 = parseInt(await return_value(propertyvalue, "geolocation_long"));
setTimeout(() => { //and this code is running after all/ I consider time
setGeo({ ...geo, lat: lat2, long: long2 });
}, 2000);
};
setter(); // put this function in onload event
my problem = second part of code isn't work properly they just return NAN value - I think they are running before first part but I need to run these code after first part ;
The process to update React state is asynchronous for performance reasons. That’s why changes don’t feel immediate.
Try this code it's help you
const setter = async () => {
let proertyVal = await (getpropertvalue(slide.slide, 0))
setPropertyvalue(proertyVal)
const lat2 = parseInt(await return_value(proertyVal, 'geolocation_lat'))
const long2 = parseInt(await return_value(proertyVal, 'geolocation_long'))
//upper two const lat2&long2 depend on setpopertyvalue
setTimeout(() => { //and this code is running after all/ I consider time
setGeo({ ...geo, lat: lat2, long: long2 })
}, 2000);
}
setter(); // put this function in onload event
}
The value of propertyvalue
is assigned when you call const [propertyvalue, setPropertyvalue] = useState()
.
Your setter
function has closed over that variable.
Next time the component renders you will have a new propertyvalue
variable with the latest value from the state, but that won't help you here.
await (getpropertvalue(slide.slide, 0))
gives you the value that you want, so store that in a local variable and use that.
const updatedPropertyvalue = await (getpropertvalue(slide.slide, 0));
setPropertyvalue(updatedPropertyvalue);
// continue to use updatedPropertyvalue in the rest of the function
You don't really need to set the propertyValue
to state here, just use it in the next async calls. Also there's no need for setTimeout
here and the whole function can be simplified as follows:
const setter = async () => {
const propertyValue = await getpropertvalue(slide.slide, 0);
const lat2 = await return_value(propertyValue, "geolocation_lat");
const long2 = await return_value(propertyValue, "geolocation_long");
setGeo({ ...geo, lat: parseInt(lat2), long: parseInt(long2) });
};