问题标签 [reactcsstransitiongroup]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
103 浏览

reactjs - 反应开关 v4 不起作用并抛出所有路线

我不知道如何解决我的问题。这是反应路由代码我怎么知道,switch 必须在我的 Base 中抛出一个路由组件,但他将所有路由都扔到 Router 中。我不知道如何使用这个对象(在图像中)并且必须获取 ReactCSSTransitionGroup 的密钥

https://www.dropbox.com/s/nzkf91delcvuo2f/%D0%91%D0%B5%D0%B7%D1%8B%D0%BC%D1%8F%D0%BD%D0%BD%D1%8B %D0%B9.png?dl=0

这是我的基类

0 投票
0 回答
413 浏览

reactjs - ReactCSSTransitionGroup 进入动画不工作,退出工作正常

我正在创建一个可重用的模式,一切正常,但是当我实际调用组件时,输入转换不起作用。退出完美。我得到错误:

warning.js:45 警告:失败的 propType:transitionLeaveTimeout 未提供给 ReactCSSTransitionGroup:这可能会导致动画不可靠,并且在 React 的未来版本中将不再支持。检查 Modal 的渲染方法

我已经按照指示提供了进入和离开超时,但仍然没有运气。

我在控制台中得到的唯一信息是:

warning.js:45 警告:失败的 propType:transitionLeaveTimeout 未提供给 ReactCSSTransitionGroup:这可能会导致动画不可靠,并且在 React 的未来版本中将不再支持。检查 Modal 的渲染方法

我不确定如何解决,因为我已经提供了进入和离开超时并且它不能解决问题。

模态的 CSS 如下:

0 投票
2 回答
314 浏览

javascript - ReactCSSTransitionGroup 与 reactJS 15 和 ReactRouter 4

我想为反应路由器创建一个过渡动画,但它似乎不起作用(没有过渡)。

正如您在下面看到的,我所做的只是创建一个组件 FadeRoute,它使用 ReactCSSTransitionGroup 创建动画,然后我在 react-router-dom 的 switch 组件中使用它

这是我的反应代码

这里是css代码

你能帮我找到铅在哪里吗?先感谢您

0 投票
1 回答
926 浏览

reactjs - 在 React 组件中使用 CSSTransition 组时未加载过渡

我正在尝试实施react-transition-group到一个项目中,但我无法让它发挥作用。我可以看到我的项目被包裹在<CSSTransition />组件内,但我无法让它们制作动画。

我怎样才能弄清楚我做错了什么?

这是代码片段:

0 投票
1 回答
30 浏览

css - ReacJS CSSTransitionGroup 如何使我的过渡更平滑并从元素中删除过渡

您好,我试图保留我的按钮position:absolute,但从中删除动画,我的动画也不够流畅,我无法真正处理它,因为没有关键帧。这是我的垃圾箱。

我的垃圾桶

0 投票
1 回答
896 浏览

css - 反应css过渡组动画单个元素

我正在使用 react-transition-group 中的 CSSTransitionGroup 并且我有一个页面显示了几个对象,这些对象通过了一些过滤器(每个过滤器都会更改数组的状态 - 否则不能这样做)。我只想在一个元素上激活离开转换(当对象的计时器变为 0 时)。

有没有办法在我过滤时不激活休假来实现它?

编辑:我数组中的每个对象都是一个拍卖,其中包含几个信息,包括一个计时器。我想在搜索我的数据库时避免激活离开动画并仅在计时器完成时激活它。

家庭组件:

0 投票
2 回答
80 浏览

javascript - Reactjs 和 2 元素动画一次

我正在尝试用 Reactjs 来实现这个效果。下面的 youtube 视频是我要实现的动画:

https://www.youtube.com/watch?v=WVBMiu1NPE&feature=youtu.be

现在我需要将它们变成一个 Reactjs 组件,我正在使用 react-addons-css-transition-group。我的代码应该做的是每次我按下按钮时,都会在 tabContent 数组中呈现一个 div 段落,然后应该由 ReactCSSTransitionGroup 对其进行动画处理。这是我的代码

这是我用于过渡的 CSS 的一部分:

我的代码没有显示动画,标签的内容立即出现,没有任何动画。我做错什么了?

0 投票
2 回答
1148 浏览

react-router-v4 - React Router v4 和 CSS 过渡组

我有一个 react-router v4 和路由转换的简单示例。它遵循https://reacttraining.com/react-router/web/example/animated-transitions中显示的示例。然而,结果是只显示了最后一条路线。其他只是空白。https://codesandbox.io/s/r0PvB30wk

0 投票
2 回答
3936 浏览

reactjs - React CSS Transition Group

Can someone help me with slide up/down transition that I am trying to create for a fullscreen popup. I am unable to get the desired ease in slide up effect using CSSTransitionGroup. The code example can be found here

Edit Material UI

Any help would be much appreciated. Thanks

0 投票
2 回答
1360 浏览

react-router - 在子路由之间移动时防止在父路由上发生反应路由器转换

我已经设置了一个带有动画转换的路由器。当用户从 /topics/rendering 移动到 /topics/components 时,是否可以仅触发子路由上的转换而不是转换整个页面。现场示例:https ://codesandbox.io/s/r0PvB30wk