Как использовать response-router и иметь разные типы анимаций (или их нет) с response-transition-group

Я использовал собственный пример анимации в React Router в качестве отправной точки и получил простую и всегда появляющуюся анимацию.

Проблема в том, что установка слишком упрощена, и мне требуется что-либо от отсутствия перехода до произвольного количества переходов (скажем, движение влево и вправо, репликация переходов приложений IOS).

Как только я начну настраивать exit а также enter реквизит TransitionGroupи изменить classNames из CSSTransition все рушится, и ничто не работает так, как если бы связывалось с уже существующими элементами и создавало множество конфигов (я попытался переместить exit а также enter реквизит для CSSTransition но безрезультатно):

<Route render={({ location }) => {
    let direction = location.state ? location.state.direction : null
    let doAnimation = !!direction 

    // direction = the type of animation to use, if null = no animation

    return (
        <TransitionGroup enter={doAnimation} exit={doAnimation} >
            <CSSTransition 
                key={location.key} 
                classNames={direction || "none"} 
                timeout={500}> 
                <Switch  
                    location={location}>
                    {routes}
                </Switch> 
            </CSSTransition>
        </TransitionGroup> 
    )
}} /> 

Есть ли способ управления анимацией, как это, возможно, отключить их все вместе? Если нет, есть ли анимация / библиотека, предоставляющая родное приложение, такое как навигация и переходы для приложения браузера?

0 ответов

Другие вопросы по тегам