如何解决React Spring useTransition 使用有条件渲染的组件无法平滑动画
我一直在使用 React 在一个小型网站上工作，并且想要动画移动菜单在状态更改时进出视图。我听说 react-spring useTransition 非常适合这个用例，并且在过去两天里一直在努力解决这个问题。
据我所知，当安装/卸载组件时，它应该在 from、enter 和 leave 对象之间平滑过渡，但在我的情况下，它似乎突然卡住了反而。当我点击按钮打开菜单时，它不是在 opacity:0 和 opacity:1 之间转换，而是突然出现，当我点击按钮关闭它时，它消失了。关闭时甚至会有短暂的延迟，我认为在此期间应该播放离开动画。
我已经尝试过 useSpring，但是对于将要卸载并且不播放离开动画的组件，它不能很好地工作。还尝试添加和删除 null 作为 useTransition 函数的第二个参数并在渲染中使用 .map 但据我所知，这些已经折旧了。
我在 codeandBox 中创建了一个小代码示例。 https://codesandbox.io/s/react-spring-menu-dz4iq
我正在使用最新的 react-spring(9.2) 和 google chrome 浏览器（如果有帮助的话）。希望你们中的一些人能指出我正确的方向。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
