问题标签 [reactcsstransitiongroup]

可能是一个菜鸟问题，但我在这里面临反应路由器周期问题。

我有

• 反应路由器，
• ReactCSSTransitionGroup

我有两个版本的 css 动画，并想根据导航类型在它们之间切换。除了浏览器的后退和前进按钮外，任何类型的用户交互都非常简单。

单击本机浏览器历史导航后和反应转换 css 转换开始之前是否触发了任何事件？我试过 browserHistory.listen，但它在动画开始后触发。

查询“React.PropTypes.shape 不是函数”实际上有一个 Google 结果。这是另一个 SO question，它没有解决此错误，尽管它与由相同的 React 插件引起的表面原因相同。

ReactTransitionGroup安装后使用时出现此错误'react-addons-css-transition-group'。

我正在使用最新的React和'react-addons-css-transition-group'版本：^15.4.2，对于每个。

```

这似乎不是我的错误，因为错误是说react函数React.PropTypes.shape不存在。这个功能是很久以前发布的，所以我很困惑。我逐字复制了CSS 类，虽然我不明白这些有什么关系

我正在尝试在反应中做一个非常简单的组件不透明度转换。我正在使用 ReactCSSTransition 组来执行此操作，并且我相信我已正确设置，但似乎无法正常工作。我将不胜感激任何帮助，请参阅下面我的代码笔：

CSS

反应路线转换

谢谢

试图弄清楚为什么这个 ReactCSSTransitionGroup 动画有效：

但不是这样：

CSS：

_toggleProjectNav 是一个从父组件传递下来的属性，用于切换 _isProjectNavOpen 状态 true/false；它的工作原理是面板隐藏/显示，但没有动画......它是否与从父级传递的状态有关？试图了解 ReactCSSTransitionGroup 是如何工作的。

谢谢！

我正在使用ReactCSSTransitionGroup、CSS 模块和 Flow。

因为我使用的是 CSS 模块，所以我必须传递对象的每个、 和enter一个enterActive键。leaveleaveActive

但是，flow对该文件的检查告诉我以下内容：

有没有办法可以消除这个错误，或者在能够使用 CSS 模块的同时传递正确的类型？

Recently, I've used ReactCSSTransitions to "slide" the new page from one side. This works fine except, of course, the moment it's implemented now the previous page will be blank. I need for the previous page to remain rendered until my new page is animated from the side from switching routes.

Which would be the correct way to implement this? Do I need to forcibly gather an HTML page and drag it alongside the new one and save it for when I press "Go back"?

我使用 React 的 CSSTransitionGroup（新的 react-transition-group@1.1.2。我不知道为什么，但过渡是在应用 3D 样式之前进行的。

当前行为（在 Chrome 和 Firefox 中）：

1. 对象作为二维对象从不透明度淡入：0 到不透明度 1
2. 对象接收 3D 样式

预期行为：

1. 对象接收 3D 样式
2. 对象从不透明度淡入为 3D 对象：0 到不透明度 1

jsx：

CSS：

我尝试根据https://reacttraining.com/react-router/web/example/animated-transitions中的示例使用 RR4 和 ReactCSSTransitionGroup 在路由组件之间设置淡入淡出过渡

动画可以工作，但是在渲染下一个组件之前，前一个组件会跳下来。

我做错了什么，是否有更简单的方法在多个组件之间进行转换（不使用参数化路径，使用 react-motion 而不是 CSSTransitionGroup）？

截屏：

https://media.giphy.com/media/l4FGnVfAgiX4Hzns4/giphy.gif

代码：

动画Trans.js

动画Trans.css。

我在 a 中有以下Modal组件渲染ReactCSSTransitionGroup：

这很好用，但我想在每次渲染Modal.

据我了解，我不能将组件放置ReactCSSTransitionGroup在组件内部，Modal因为它需要在此之前渲染。

我能做些什么来确保每次调用它时Modal总是没有重复包装代码？modalTransition ReactCSSTransitionGroup

当单击按钮以在状态之间切换时，我试图在组件进入和离开之间进行转换

我也尝试过将<UserDetails />和<UserEdit />作为单独的组件，但结果相同，即没有触发动画。

https://www.webpackbin.com/bins/-KjIPcMeQF3iriHRqTBW

你好.js

样式.css