Skip to content

Entering Component not animated #117

@xeroe

Description

@xeroe

Hello,
Im facing the issue that when using this lib only the leaving component is being animated, while the entering one is not.
Instead react is showing a white screen for a second before the second component is popping in.
I tried sticking to the example code as close as possible to prevent but still cant fix the issue and im running out of ideas.

  <Route
    render={({ location }) => (
      <div>
        <AnimatedSwitch
          {...pageTransitions}
          runOnMount={location.pathname === "/"}
          mapStyles={(styles) => ({
            transform: `translateX(${styles.offset}%)`,
          })}
        >
          <Route
            exact
            path="/login"
            component={() => <Login callback={this.login} />}
          />
          <Route exact path="/register" component={Register} />
          <Route exact path="/" component={Landing} />
          <Route
            path="/"
            component={() => <Login callback={this.login} />}
          />
        </AnimatedSwitch>
      </div>
    )}
  />

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions