如何重置反应原生动画？答案

【问题标题】：How to reset a react-native animation?如何重置反应原生动画？
【发布时间】：2018-08-06 16:36:23
【问题描述】：

我使用来自react-native 的Animated 制作了一些简单的动画动画在第一次 onPress 后按预期工作，但我不知道如何重置它，以使其在下一次点击时工作。

constructor(props) {
    super(props);
    this.spinValue = new Animated.Value(0);
    // Second interpolate beginning and end values (in this case 0 and 1)
    this.spin = this.spinValue.interpolate({
        inputRange: [0, 1, 2, 3, 4],
        outputRange: ['0deg', '4deg', '0deg', '-4deg', '0deg']
    });
}

handlePress() {
    // First set up animation 
    Animated.timing(
        this.spinValue,
        {
            toValue: 4,
            duration: 300,
        }
    ).start();
}

在渲染中

<TouchableWithoutFeedback onPress={() => { this.handlePress(); }} >
                    <Animated.Image
                        source={someImg}
                        style={{ height: undefined, width: undefined, flex: 1, transform: [{ rotate: this.spin }, { perspective: 1000 }] }}
                        resizeMode={'contain'}
                        resizeMethod="resize"
                    />
</TouchableWithoutFeedback>

有什么建议吗？谢谢

【问题讨论】：

标签： reactjs react-native

【解决方案1】：

您可以使用this.spinValue.setValue(0) 重置它。您可以在handlePress 的开头添加它。

【讨论】：

我似乎在最新的 API 中找不到 setValue 了。此方法是否已弃用？

【解决方案2】：

你可以使用Aminated.reset()方法。

【讨论】：