React Native - Animated Functional Components

私はReact NativeアニメーションAPIが大好きですが、完全にステートレスな機能コンポーネントであるコンポーネントを書いている私の好みの方法と大きく矛盾します。React Native - Animated Functional Components

例として、このコンポーネントを使用してください。イメージのスタイルを駆動するために、クラス構文と状態変数に戻さずにイメージをアニメーション化するにはどうすればよいでしょうか？

const Logo =() => (
    <View style={styles.container}> 
    <View style={styles.imageContainer}> 
     <Animated.Image 
     resizeMode='contain' 
     style={styles.image} 
     source={require(img/sample.png')} 
     /> 
    </View> 
    </View> 
) 

export default Logo

出典

2017-07-07 Brian F

つまり、コンポーネントに状態（アニメーション化されている可能性が高いため）がある場合は、クラス構文を使用して多くのことを行うことはできません。機能的な構成要素は、状態を持たず、単に小道具を提示するだけである。 – Li357

ええ、あなたは正しいと思います。私はちょうどコンポーネントがダンプの地面になることを開いていれば、私が見つけたようにそれを単なるアニメーションにするために何らかの方法をしたいと思うでしょう。 –

アニメーションの値を保持するためにstoreを使用できます。しかし、IMOは悪い考えです。クラスを使うだけです。）より柔軟にする必要があります。

代わりにhttps://github.com/oblador/react-native-animatableを宣言構文で試してみてください。私は前にそれを使用しなかったが、それが助けることができるように見える。

出典

2017-07-07 02:13:36 farwayer

私はこのライブラリや、アニメーションを別のコンポーネントにラッピングして状態を分離する方法が最善の方法だと思います。乾杯。 –

React Native - Animated Functional Components

答えて

関連する問題