#reactjs
#reactjs
Вопрос:
Я хочу вызывать функцию только после выполнения предыдущей функции. Я пробовал с promises, но это не работает, я также пробовал с async await, но выполняется последняя функция.После выполнения первой функции я хочу передать значение ее состояния следующей функции и так далее.Пожалуйста, помогите мне в этом.Заранее спасибо.
handleAllFunctionsOnClickPayLater() {
let promise = Promise.resolve();
promise
.then(() => this.handleGuestLogin())
.then(() => setTimeout(this.handleAddress(),1000))
.then(() => setTimeout(this.handlePayLater(),2000))
}
handleGuestLogin() {
const UserDetails = {
name: this.state.name,
email: this.state.email,
mobile: this.state.number
}
fetch(api,{
method : 'POST',
body: JSON.stringify(UserDetails)
})
.then(res => res.json())
.then(data => {
return this.setState({
cid: data.Data.cid
},() => {console.log(this.state.cid)})
})
}
handleAddress() {
var address_details = {
cid:this.state.cid
...other details
}
fetch(api,{
method : 'POST',
body: JSON.stringify(address_details)
})
.then(res => res.json())
.then(data => {
console.log("address added in db customer_address",data);
return this.setState({
address_id: data.address_id,
})
}
handlePayLater = () => {
var bookingDetails = {
cid: this.state.cid,
address_id: this.state.address_id
}
fetch(api,{
method : 'POST',
body : JSON.stringify(bookingDetails)
})
.then(res => res.json())
.then(data => {
return this.setState({bookingId:data.booking_id});
}
Комментарии:
1. Добавьте реализации
this.handleGuestLogin()
,this.handleAddress()
иthis.handlePayLater()
2. да, добавлены эти реализации
Ответ №1:
Предполагая, что handleAddress
, handleGuestLogin
и handlePayLater
возвращают обещания, вы можете использовать функцию async / await
synchronousPromises = async () => {
try {
const handleGuestLoginResult = await this.handleGuestLogin();
const handleAddressResult = await this.handleAddress();
const handlePayLaterResult = await this.handlePayLater();
} catch (error)
{
return reject(error); //will cause .catch to fire
}
return resolve([
handleGuestLoginResult,
handleAddressResult,
handlePayLaterResult
]); //will cause .then to fire
}
поскольку synchronousPromises является async
функцией, она сама возвращает обещание. чтобы использовать ее, вы можете вызвать ее как
callSyncronousPromises = () => {
synchronousPromises()
.then(success => {
//handle success
})
.catch(error => {
//handle error
}
}