Javascript等待Promise在继续动画的异步函数之前在另一个函数中解析

Question

我有一个带有动画功能的react-native应用程序，我正在尝试创建一个动画助手函数，等待在另一个屏幕上解析一个值，然后继续执行并将值返回给动画函数。

动画助手功能取决于用户购买或不在另一个屏幕上购买订阅的结果，并且我将承诺传递给第二个屏幕，以便用户是否购买订阅来解决。在解除了这个承诺后，我想继续执行我的第一个动画助手函数并返回用户是否购买了我的第一个动画函数的订阅值。

这是我的动画功能

Animated.timing(position, {
             toValue: {x: width, y: 0},
             duration: 300,
           }).start(async() => {
            const touchJustAdded = await animationHelper({props})
             this.setState({touchJustAdded: actionAllowed}) //This should update the state with the value returned from the animation helper before continuing animation. 
//touchJustAdded is used in another function to control the text shown in the animated view, so I need the value to be set here before continuing the animation.  I also don't want to continue the animation until the user returns from the BuySubscription screen. 
               Animated.timing(position, {
               toValue: {x: 0, y: 0},
               delay: 1200,
               duration: 300,
             })
           })

这是我的动画助手功能

const AnimationHelper = async ({props}) => {
  //check if user has a subscription or other conditions are met, do stuff, then return true.   Otherwise, navigate to BuySubscription screen
  navigation.navigate('BuySubscription',{promiseCallback})
  //I want to pause execution here until the promiseCallback promise is resolved
  return subscriptionBought //I need to wait for the user to complete their action on the other screen and then somehow return the value to the animationHelper before returning here
}

以下是我如何创造承诺：

promiseCallback = async (subscriptionBought) => {
  return new Promise((resolve,reject) => {
    resolve( subscriptionBought)
  })
}

当用户离开该屏幕时，使用此代码在BuySubscription屏幕中解决此承诺：

  this.props.navigation.state.params
    .promiseCallback(this.state.subscriptionBought)

我想在继续AnimationHelper之前等待承诺得到解决。

任何帮助表示赞赏！我已经搜索但我不明白如何在不调用它的情况下等待动画函数中的promiseCallback。

Answer 1

你可以做到这样没有这样的承诺：

屏蔽1：

promiseCallback = (subscriptionBought) => {
  alert("Result: " + subscriptionBought)
  // continue your animation here
}

const Animation = async ({props}) => {
  //start animation
  navigation.navigate('BuySubscription', {promiseCallback: this.promiseCallback})

  return
}

现在在你的qazxsw poi屏幕上调用qazxsw poi关于qazxsw poi事件：

BuySubscription

Answer 2

试试这个

promiseCallback

Answer 3

你还必须在你的承诺componentWillUnmount

componentWillUnmount() {
  this.props.navigation.state.params.promiseCallback(this.state.subscriptionBought);
}

。并且还必须等待你调用promise函数的地方。

const functionToAwait = async ({props}) => {
  let hold = await promiseCallback();
  if(hold){
  navigation.navigate('BuySubscription',hold)
  //I want to pause execution here until the promiseCallback promise is resolved
  return
  }
}

await

function