Animate.spring完成后调用函数

时间:2017-04-30 08:01:15

标签: reactjs react-native react-native-ios

我正在使用动画,以便弹出窗口从右侧进入。我正在使用以下代码 -

  var toValue = 200;

  if(this.state.fileMenu){
    toValue = 0;
  }

  Animated.spring(
    this.state.bounceValue,
    {
      toValue: toValue,
      velocity: 3,
      tension: 2,
      friction: 5,
    }
  ).start();
  //I want to call a function here after the animation is finished.

  this.setState({fileMenu: !this.state.fileMenu});

代码运行完美,看起来很棒,但是,我现在只想在动画完成时调用一个函数,并且只需要调用一次。只是想知道我怎么能这样做?不确定这是否是一个非常简单的问题。

1 个答案:

答案 0 :(得分:5)

start采用回调函数,该函数在动画结束后执行一次:

 Animated.spring(
    this.state.bounceValue,
    {
      toValue: toValue,
      velocity: 3,
      tension: 2,
      friction: 5,
    }
  ).start(() => doSmething());