animated_routes_react icon indicating copy to clipboard operation
animated_routes_react copied to clipboard

Animated only on App start

Open stephane-r opened this issue 7 years ago • 0 comments

Hi mhaagens,

I would like use your solution for the transition of my roads on a React application :) I've try to add your config on my App (this same version), but the transition work only when App start (so, first rendering).

After, when i change my route, AnimatedSwitch component does not seem to work : no information in console.log(). I've just componentWillAppear.

This my App.js :

export default class extends React.Component {
  render() {
    if (!user.isLogged) {
      return <Login />;
    } else {
      return (
        <div>
          <Header />
          <Route
            render={({ location }) => (
              <TransitionGroup component="main">
                <AnimatedSwitch
                  key={location.key}
                  location={location}
                >
                  <Route exact path={routePath.mediaCreator} component={MediaCreator} />
                  <Route exact path={routePath.builderAdd} component={Builder} />
                  <Route exact path={routePath.builderEdit} component={Builder} />
                  <Route exact path={routePath.myPresentations} component={MyPresentations} />
                  <Route exact path={routePath.presentation} component={Presentation} />
                </AnimatedSwitch>
              </TransitionGroup>
            )}
          />
        </div>
      );
    }
  }
}

const App = (
  <Router>
    <Main />
  </Router>
);

I think the problem is because location.key is undefined, but i don't know why.

Do you have any idea ?

Thank you !

stephane-r avatar Sep 01 '17 09:09 stephane-r