Question

我想在我的react本机项目的动画结尾调用函数（或设置状态）。我该怎么做？请帮帮我。

我的代码：

import React,{component} from 'react';
import {Animated, View} from 'react-native';
class Animation extends Component {
  constaructor(){
     super()
     this.AnimationValue= new Animated.Value(0),
  }
  componentDidMount() {
    Animated.timing(
      this.AnimationValue,
      {

        toValue: 1,
        duration: 4000,
      }
    ).start();
  }

  render() {
    const marginLeft = this.AnimationValue.interpolate({
        inputRange: [0, 1],
        outputRange: ['0', '300']
    });
    return (
      <Animated.View style={{marginLeft}} >
        // ... my code
      </Animated.View>
    );
  }
}

Answer 1

它是start()中的回调。

Animated.timing(
  this.AnimationValue,
  {
    toValue: 1,
    duration: 4000,
  }
).start(hereGoesTheFunctionReference);

Answer 2

.start(callback)在动画开始时触发。

使用箭头功能代替，例如 .start(()=>...)

如何在动画结束时调用函数本地反应

2 个答案: