2

我使用 React Router 自己的动画示例作为起点,并获得了一个简单的始终淡入动画效果。

问题是,这种设置太简单了,我需要任何东西,从根本没有过渡到任意数量的过渡(例如,向左和向右定向运动,复制 IOS 应用程序过渡)。

一旦我开始调整 的exitenter道具,事情的TransitionGroup变化就会崩溃,没有什么能像弄乱已经存在的元素并创建一堆配置一样起作用(我试过移动和道具无济于事) :classNamesCSSTransitionexitenterCSSTransition

<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> 
    )
}} /> 

有没有像这样控制动画,可能一起禁用它们?如果没有,是否有动画/库为浏览器应用程序提供导航和转换等原生应用程序?

4

0 回答 0