javascript - GSAP-reverse() 不动画回来

Question

动画在播放时有效，但在使用reverse()函数时无效

这是演示 https://codesandbox.io/s/gatsby-express-9uqi7导航栏组件

const [state, setState] = useState(false);
    const menuManage = (e)=> {
        if(!e.target.classList.contains('select')){
            const wrapper = document.querySelector('.wrapper');
            const tl = new TimelineMax({paused: true})
                .to(wrapper, 0.15, {height: '100vh', width: '100vw', left:0})
                .to(wrapper, 0.15, {borderBottomLeftRadius: '0%'});
            if(state){
                tl.reverse();
                setState(false);
            }
            else{
                tl.play();
                setState(true);
            }
        }
    }

Answer 1

我猜测这是因为当您调用 .reverse() 时，时间线的播放头位于时间线的开头。尝试使用 tl.progress(1).reverse(); 代替。如果没有演示，就不可能判断这是否是问题所在。