ReactCSStransitionGroupまたはReactTransitionGroupを使用してReact JSでステートレスコンポーネントをスライドさせるにはどうすればいいですか？

Question

最初にdisplay:noneに設定されているステートレスコンポーネントを、親コンポーネントの1つで状態が変更された後に表示するようにスライドしたい場合は、あたかもドロップダウンのようにスライドするようにします。 私はアニメーションの部分に新しいです、私は試していたthis_link。

これまでのところ私はサンドボックス（https://codesandbox.io/s/0xrjp051pp）で試しました。

誰かがこれに助けてもらえますか？

Answer 1

ここでは、移行作業が変更されたサンドボックスがあります。 https://codesandbox.io/s/nrz8vlmrrlあなたが修正する必要がある唯一の事は、CSSコードを動作させることです。

私が行った変更は次のとおりです。

1. コンポーネントの表示にCSSのトランジションクラスを変更しました。以前は表示されていませんでした。
2. あなたが渡していたが、コンポーネントで使用していない小道具に基づいて、コンポーネントを表示して非表示にしますSubComponent。