javascript - 如何使用 ReactCSStransitionGroup 或 ReactTransitionGroup 在 React JS 中向下滑动无状态组件？

Question

我想滑动一个无状态组件，该组件最初设置为display:none，在其父组件之一的状态更改后可见，就好像它像下拉菜单一样向下滑动。我是动画部分的新手，我正在尝试this_link。

到目前为止，我在 Sandbox（https://codesandbox.io/s/0xrjp051pp）中尝试了什么。

有人可以帮忙吗？

Answer 1

这是经过修改的沙盒，转换工作正常。https://codesandbox.io/s/nrz8vlmrrl您唯一需要修复的是 CSS 代码以使其正常工作。

我所做的更改如下。

1. 更改 CSS 中的过渡类以显示组件。它以前有显示：无。
2. 根据您传递但未在组件中使用的道具显示和隐藏组件SubComponent。