ReactTransitionGroup + ReactRouter та же ошибка пути - PullRequest
0 голосов
/ 15 октября 2018

Я экспериментировал с react-transition-group и наткнулся на ошибку, которую я не могу исправить самостоятельно.По какой-то причине анимация срабатывает также при нажатии на текущий путь.Таким образом, если я в данный момент нахожусь на /home и нажимаю на ссылку, которая ведет по тому же пути, анимация сработает и просто изменит текущий компонент.Для простоты предположим, что этот компонент изменяет непрозрачность только с 0 до 1.

Код здесь:

 <Navigation/>
 <TransitionGroup>
          <CSSTransition
            key={this.props.location.key}
            timeout={{ enter: 500, exit: 400 }}
            classNames="fade"
          >
            <Switch location={this.props.location}>
              <Route
                path="/phrasals/en"
                render={() => {
                  return (
                    <Layout>
                      <PhrasalVerbsEn />
                    </Layout>
                  );
                }}
              />
              <Route
                path="/phrasals/ge"
                render={() => {
                  return (
                    <Layout>
                      <PhrasalVerbsGe />
                    </Layout>
                  );
                }}
              />
              <Route
                path="/verbs"
                render={() => {
                  return (
                    <Layout>
                      <IrregularVerbs />
                    </Layout>
                  );
                }}
              />
              <Route
                path="/supported-languages"
                render={() => {
                  return (
                    <Layout>
                      <Languages />
                    </Layout>
                  );
                }}
              />
              <Route
                path="/"
                exact={true}
                render={() => {
                  return (
                    <Layout>
                      <Home />
                    </Layout>
                  );
                }}
              />
              <Route
                path="/courses"
                exact={true}
                render={() => {
                  return <CourseList />;
                }}
              />
            </Switch>
          </CSSTransition>
        </TransitionGroup>

Фактическая сборка с представленной здесь ошибкой:https://d -ivashchuk.github.io / irregio реагируют /

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...