关于Tween的chain方法由于浅拷贝出现不能启用一个tween的bug

Posted hpugisers

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于Tween的chain方法由于浅拷贝出现不能启用一个tween的bug相关的知识,希望对你有一定的参考价值。

昨天由于版本升级把tween18.6.0升级到18.6.4结果封装的动画无法使用,究其原因是为了浅拷贝的问题
出现问题的代码示例:

            this.tween = new TWEEN.Tween(this.startParms).to(this.targetParms, options.duartion);

            this.tween.easing(TWEEN.Easing.Linear.None);
    
            this.tweenback = new TWEEN.Tween(this.targetParms).to(this.startParms, options.duartion);

            this.tweenback.easing(TWEEN.Easing.Linear.None);
    
            this.tween.chain(this.tweenback);

            this.tweenback.chain(this.tween);

造成原因是tween经过动画后this.startParms会变成this.targetParms,造成tweenback的参数this.targetParms与this.startParms相同这是因为浅拷贝造成了this.startParms的改变。
改进代码:

            this.tween = new TWEEN.Tween(this.startParms).to(this.targetParms, options.duartion);

            this.tween.easing(TWEEN.Easing.Linear.None);
    
            this.tweenback = new TWEEN.Tween(clone(this.targetParms)).to(clone(this.startParms), options.duartion);

            this.tweenback.easing(TWEEN.Easing.Linear.None);
    
            this.tween.chain(this.tweenback);

            this.tweenback.chain(this.tween);

clone封装:

/*
 * @Description: 深度拷贝
 * @Author: gjw
 * @Date: 2020-11-26 09:17:19
 * @LastEditTime: 2020-11-26 10:39:56
 * @LastEditors: gjw
 * @Reference: 
 */
import defaultValue from './defaultValue';

    /**
     * 深度拷贝
     * @param * object 深度拷贝的对象
     * @param Boolean [deep] 是否完全拷贝,默认不完全拷贝,对于一般不需要完全拷贝
     * @return * 
     */
    function clone(object:any, deep?:Boolean) 
        if (object === null || typeof object !== 'object') 
            return object;
        

        deep = defaultValue(deep, false);

        let result = new object.constructor();
        for ( let propertyName in object) 
            if (object.hasOwnProperty(propertyName)) 
                let value = object[propertyName];
                if (deep) 
                    value = clone(value, deep);
                
                result[propertyName] = value;
            
        

        return result;
    
export default clone;

以上是关于关于Tween的chain方法由于浅拷贝出现不能启用一个tween的bug的主要内容,如果未能解决你的问题,请参考以下文章

关于Tween的chain方法由于浅拷贝出现不能启用一个tween的bug

JavaSE知识集锦深拷贝与浅拷贝

JS: 关于深拷贝和浅拷贝

关于System.arraycopy浅拷贝的研究

关于深拷贝与浅拷贝

python深拷贝与浅拷贝