问题描述

React Native 项目升级到 0.62，之前写的有关 Animated 方法，出现了警告。

WARN Animated: "useNativeDriver" was not specified. This is a required option and must be explicitly set to "true" or "false"

解决方法

如提示所说，需要明确指定 useNativeDriver 选项，并且设置为 true 或者 false 。

1. Composing animations

参考 官网的 Animated api ，包括 Animated.decay()，Animated.timing()，Animated.spring()，Animated.parallel()、Animated.sequence()等创作动画的方法，配置 config 参数时指定  useNativeDriver 。如：

Animated.timing(this.state.animatedValue, {
  toValue: 1,
  duration: 500,
  useNativeDriver: true, // 添加这一行
}).start();

2. Animatable components 组件

包括 Animated.Image、 Animated.ScrollView、Animated.Text、Animated.View、Animated.FlatList、Animated.SectionList 等动画视图，绑定Animated.event() 时， config 参数添加 useNativeDriver 。如：

<Animated.ScrollView
  scrollEventThrottle={1}
  onScroll={Animated.event(
    [{ nativeEvent: { contentOffset: { y: this.state.animatedValue } } }],
    { useNativeDriver: true } // 添加这一行
  )}
>
  {content}
</Animated.ScrollView>