我遇到了以下on github,它构成了一个专门用于管理抽屉式侧面导航行为的类的一部分。
closeSideNav() {
this.sideNav.classList.remove('side-nav--visible');
this.sideNavContent.classList.add('side-nav__content--animatable');
this.sideNavContent.style.transform = 'translateX(-102%)';
let onSideNavClose = () => {
this.sideNav.removeEventListener('transitionend', onSideNavClose);
}
this.sideNav.addEventListener('transitionend', onSideNavClose);
}
这个功能的前三行不需要解释,但我对最后三个有点困惑。起初,我认为transitionend
事件监听器已被添加,然后立即删除 - 可能发信号通知另一段未在此处显示的代码 - 但现在我真的不习惯这种模式。
这些线的目的是什么?
答案 0 :(得分:4)
不立即删除。它在触发一次后删除。这是一次性UI操作的常见模式,例如导航只能关闭一次,第二次按下按钮没有任何意义,可能会混淆正在运行的动画等。