Questions tagged [reactcsstransitiongroup]

Related to React library transitions

Related to React library transitions:

React implements one-way reactive data flow which reduces boilerplate and is easier to reason about than traditional data binding.

React uses a virtual DOM diff implementation for ultra-high performance. It can also render on the server using Node.js — no heavy browser DOM required.

https://reactjs.org/

202 questions
0
votes
2 answers

Getting warning about unique "key" when trying to import ReactCSSTransitionGroup into react app

I hope somebody could shed some light into this issue. After many attempts, I was able to import ReactCSSTransitionGroup into my react app correctly. Now I'm getting the following warning and my transition is not working. Warning: Each child in an…
0
votes
0 answers

React CSSTransitionGroup animation doesn't work

I am trying the following simple show/hide animation and the item does appear and disappear but without any animation: toggleChangePassword = () => { this.setState({ showChangePassword: !this.state.showChangePassword }) } ....
ilyo
  • 35,851
  • 46
  • 106
  • 159
0
votes
1 answer

Getting a warning 'string refs not supported,please use callback' when using csstransition on reaccomponents?

I'm getting this warning: string refs not supported, please use callback when using CSS transition on React components. render() { } I wrapped the…
0
votes
1 answer

CSSTransition animation not working

I have an animation for a react component, which i can't get to run. I think there's something wrong with the transitions, because if i just to an animation of the opacity it all works fine I'm using the CSSTransitionGroup from…
Fripo
  • 173
  • 1
  • 4
  • 13
0
votes
1 answer

React CSSTransitionGroup not transitioning smoothly

Hi, I am trying to use React's CSSTransitionGroup to smoothly fade in a spinner for loading during an async call once a button is clicked, but even when I do everything according to the documentation…
gpsugy
  • 1,199
  • 1
  • 11
  • 25
0
votes
0 answers

React CSSTransitionGroup with multiple components

I am trying to build a reusable animated overlay. However, only the first component mount is detected, meaning that I can only use this overlay once for my whole application. If I use a second one, it won't be animated. I tried a lot of thing,…
Eric Burel
  • 3,790
  • 2
  • 35
  • 56
0
votes
2 answers

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 Any help would be much…
Sourav Chatterjee
  • 780
  • 2
  • 13
  • 26
0
votes
2 answers

React Router v4 & CSS Transition Group

I have a simple example of react-router v4 & route transitions. It follows the example shown at https://reacttraining.com/react-router/web/example/animated-transitions. The result, however, is only the last route is shown. The others are just blank.…
Brad Woods
  • 1,507
  • 2
  • 12
  • 30
0
votes
1 answer

react css transition group animate single element

I am using CSSTransitionGroup from react-transition-group and I have a page displaying several objects, which go through some filters (every filter changes the state of the array - cant do it otherwise). I want to activate leave transition only on…
golan
  • 19
  • 5
0
votes
1 answer

Transitions not loading when using CSSTransition group in React component

I'm trying to implement react-transition-group into a project, but I cannot get it to work. I can see that my items are wrapped inside the component, but I cannot get them to animate. How can I figure out what I'm doing wrong? Here…
intercoder
  • 2,171
  • 7
  • 23
  • 34
0
votes
0 answers

react switch v4 doesn't work and throw all route's

i don't know how solve my problem. This is react route code How i know, switch must throw one route component in my Base, but he throw all route's in Router.I don't know how work with this object( in image) and have to get key for…
0
votes
1 answer

Applying the same `ReactCSSTransitionGroup` every time to a component without reusing code

I have the following Modal component rendering inside a ReactCSSTransitionGroup:
alanbuchanan
  • 3,993
  • 7
  • 41
  • 64
0
votes
1 answer

React Router v4: Animated transition jumps down

I try to setup fade-in fade-out transition between routed components using RR4 and ReactCSSTransitionGroup based on example from https://reacttraining.com/react-router/web/example/animated-transitions Animations work, however previous component…
unkind
  • 27
  • 6
0
votes
1 answer

Allow an object (for CSS Modules) to be passed to ReactCSSTransitionGroup for Flow validation

I am using ReactCSSTransitionGroup, CSS Modules, and Flow.
alanbuchanan
  • 3,993
  • 7
  • 41
  • 64
0
votes
1 answer

ReactJS ReactCSSTransitionGroup why does it work one component but not another?

Trying to figure out why this ReactCSSTransitionGroup animation works: class SlideExample extends React.Component{ constructor(props) { super(props); this.state = { visible: false }; this.handleClick =…
vesperae
  • 1,291
  • 2
  • 19
  • 28