页面中多次使用TWEEN.update()的坑

页面中多次使用TWEEN.update()的坑

tween.js就不再介绍了。这次只关心这个update()方法。

tween.js中文文档： https://github.com/tweenjs/tween.js/blob/master/README_zh-CN.md

function animate() {
    requestAnimationFrame(animate);
    TWEEN.update();
}

这个update方法是全局的，如果页面中多个canvas的，多个三维场景都使用了tween，就会出现了多个update方法。会更新多次，导致动画结果异常。搞不懂，tween为什么会有这种设计，整个window中就一个TWEEN。
之前每个组件都用到tween动画，然后放在一个页面组成大屏。开发了好久才遇到这个bug，真的很难受。
研究了一下发现可以用组来解决这个问题new TWEEN.Group();，在每个组件中都新建一个组，然后把动画都加载到这个组中，更新的时候就只更新组，tweenGroup.update()。禁止页面中出现TWEEN.update()。
tween.js做差值动画已经习惯，看看有没有其他的合适的替代品。