Javascript 响应本机动画。正在延迟spring回调

我正在我的react native应用程序上设置一个简单的布局，上面有一个产品列表，在其中可以单击并打开预订流程。当你点击一个产品时，整个应用程序会向左滑动，产品页面也会从右向左滑动

当我从产品页面单击后退时，我将应用程序和产品滑回右侧。但是因为产品页面是booking流的一部分，所以我假设通过将状态设置为false来卸载BookingFlow组件

问题是动画的回调有延迟，所以需要400毫秒才能卸载BookingFlow组件

为此，我使用Animated.parallel的回调：

closeProduct () {
  Animated.parallel([
    Animated.spring(this.props.translateXApp, {
      toValue: 0,
      duration: 140,
      bounciness: 0,
      speed: 14,
      easing: Easing.ease,
      useNativeDriver: true
    }),
    Animated.spring(this.translateXProduct, {
      toValue: width,
      duration: 140,
      bounciness: 0,
      speed: 14,
      easing: Easing.ease,
      useNativeDriver: true
    })
  ]).start(() => {
    this.props.closeBookingFlow()
  })
}

在我的app.js上，以下是我的代码：

    <Animated.View style={[styles.translateXView,{transform: [{translateX: this.translateXApp},{scale:this.scallApp}]}]}>
      <Application  
        openCategory={this.openCategory.bind(this)} 
        openProduct={this.openProduct.bind(this)}
      />
    </Animated.View>

    {
    this.state.showBookingFlow == true?
    <BookingFlow 
      closeBookingFlow = {this.closeBookingFlow.bind(this)}
      onRef={ref => (this.bookingFlowRef = ref)}
      translateXApp = {this.translateXApp}
    />
    :null
    }

有没有办法避免动画回调中的延迟？

---

谢谢大家。

我发现我需要将这两个值添加到我的springs动画中：

---

restSpeedThreshold:100，restDisplacementThreshold:40

不错。对于我的用例，我发现

restSpeedThreshold:1000，restDisplacementThreshold:100

工作得更好。这似乎是一种猜测和测试。我找不到任何文档或文章提供了一种更具目的性的方法来确定合适的值。

  setTimeout(function(){
    that.props.closeBookingFlow()
  }, 400);