Stack Overflow
Stack Overflow

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
2
votes
0 answers

React re-rendering on transition leave

I have 2 paths: /blog /blog/:slug The first path's content shows a list of links to the second path. When clicking on a link, the new page is displayed using a ReactCSSTransitionGroup from my App.js file: ... const Routes =…
Marcos Mellado
  • 125
  • 2
  • 11
2
votes
1 answer

ReactCSSTransitionGroup not working

I'm trying to make an element fade in but it doesn't do anything at all. The overall goal is to show the element when I switch the state (by clicking and trigger showOptions()) I can't seem to get any of the animation working at all though, with or…
Andre
  • 233
  • 8
  • 24
2
votes
1 answer

How to import ReactCSSTransitionGroup using es6 syntax?

I'm trying to create Modal window to my React app, and I'm following this tutorial. However, I got the following error Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or…
Tuomas Toivonen
  • 21,690
  • 47
  • 129
  • 225
2
votes
1 answer

ReactCSSTransitionGroup - how to override componentWillLeave(callback)?

I'm trying to access the componentWillMount hook in order to fade out a canvas element that is not a child of the transitioning component. (Animation of itself works as expected.)
Robert Lombardo
  • 152
  • 1
  • 9
2
votes
0 answers

React CSSTransitionGroup issue when accessing offsetHeight of animated component during transition

I ran into an issue while adding page transitions with React CSSTransitionGroup. The problem is that animation stops working as expected if I access offsetHeight of the transitioned component while it still being animated. Check out this example on…
kulesa
  • 2,964
  • 20
  • 11
2
votes
0 answers

React-router - How can i implement RouteCSSTransitionGroup to only do the animations on direct child?

We got this awesome exemple of changing page animation, but i want to manage the global page change animation and state change animation in a form with 4 states. There's the…
Crak_mboutin
  • 1,046
  • 2
  • 12
  • 18
2
votes
1 answer

react-router transition animation on initial page load

I would like to apply animations to components when I transition with react-router, and I am able to do this only after the initial load, however I want to see the animation on the initial mount as well (page refresh). This is what I have tried.…
Julien Vincent
  • 1,210
  • 3
  • 17
  • 40
1
vote
1 answer

How to prevent the page CSS transitions when the browser’s back button is clicked

I have a simple page transition that gets called when clicking a link. The new page animates from the bottom of the screen upwards to the top. It works fine, but it's also working when you click the back button in the browser. I don't want the…
cannon303
  • 403
  • 2
  • 12
1
vote
1 answer

CSSTransition is not triggered

Sandbox: https://codesandbox.io/s/practical-mountain-cjrte?file=/src/App.js I'm trying to use CSSTransition from react-transition-group, for the first time, and it does not work :( When I click on my button "learn more", I want to display the…
KaptainIglo
  • 152
  • 1
  • 10
1
vote
0 answers

TransitionGroup component laggs on exit-active

I am implementing a slider for components rendered by the router. Created a component with TransitionGroup to automate appending of the classes by CSSTransition, and the code can be seen in a sandbox here. I have added 8 classes (2x enter, enter…
borgmater
  • 658
  • 3
  • 11
  • 35
1
vote
0 answers

React "router-like" animations

I have a sidebar sliding menu that should act like a Router with transitions, but based on my app's state (redux) instead of routes. The first time the menu is opened the transitions works fine. But, when I change between two inner components of the…
Shining Love Star
  • 5,734
  • 5
  • 39
  • 49
1
vote
0 answers

React Warning: findDOMNode is deprecated in StrictMode

I´m trying to use CSSTransition group but receiving the warning 'Warning: findDOMNode is deprecated in StrictMode.'. I´ve been seraching for different threads on internet but non of them useful, or at least not sure how to implement them. Any ideas…
Mario
  • 13
  • 3
1
vote
1 answer

CSSTransition nodeRef for component with direct children

I want to get rid of the warning on StrictMode for findDOMNode when using react-transition-group but I stumbled upon an issue. My component looks like this: class Slide extends React.Component { nodeRef = React.createRef(); render() { …
IceWhisper
  • 807
  • 1
  • 11
  • 20
1
vote
2 answers

How do I use React's CSSTransitionGroup to fade-in/out my alert message?

I'm trying to build a React 16.13.0 Flash component, that I would like to fade-in and fade-out an alert message (for instance, to tell the user something has saved successfully). I'm using the CSSTransitionGroup to try and do this. I built this…
Dave
  • 15,639
  • 133
  • 442
  • 830
1
vote
0 answers

React:Using Call-back functions to coordinate animations

I am new to React and I want to see if my design logic is correct. I wish to animate a grid. A grid is composed of lines. Therefore, I have defined a component and a child component . I figured that each should…
michael_fortunato
  • 160
  • 1
  • 14
1 2 3
…
13 14