CocosCreator编码贴士:活用_isOnLoadCalled属性延迟代码执行时机

我这个人有一个习惯,喜欢写getter/setter,这样的好处是在设置了某属性值时会自动更新UI,省了不少事,但是在cocosCreator里面更新UI的操作必须在onLoad事件触发之后,如果不遵循这个原则,那么你访问的节点很有可能是空。
例子代码:

cc.Class({
    extends: cc.Component,

    properties: {
        background: cc.Sprite,
        bgImg: {
            get () {
                return this._bgImg;
            },
            set (value) {
                if(this._bgImg!= value)
                {
                    this._bgImg= value;
                    this.updateView();
                }
            },
            visible: false
        },

    },

    updateView(){
        this.background.spriteFrame = this._bgImg;
    },

});

每当我设置了上述代码中的bgImg = xxx时都会导致updateView方法被调用来更新UI,即改变this.background的纹理。但是有时候在updateView方法被调用时我的onLoad方法还未被执行,这时候this.background就是underfined,这样的话就会导致报错。
好在cc.Component类里面提供了一个私有属性叫做_isOnLoadCalled,下面是官方API文档对其的解释:

_isOnLoadCalled Number 返回一个值用来判断 onLoad 是否被调用过,不等于 0 时调用过,等于 0 时未调用。
那么,借助该属性,我们可以把代码改为

cc.Class({
    extends: cc.Component,

    properties: {
        background: cc.Sprite,
        bgImg: {
            get () {
                return this._bgImg;
            },
            set (value) {
                if(this._bgImg!= value)
                {
                    this._bgImg= value;
                    if(this._isOnLoadCalled)//对onLoad是否已被调用的把关
                    {
                        this.updateView();
                    }
                }
            },
            visible: false
        },

    },

    //因为bgImg的setter中可能没能执行updateView,因此在onLoad中需要执行该方法,哪怕updateView被执行了两遍也没关系
    onLoad(){
        this.updateView();
    }

    updateView(){
        this.background.spriteFrame = this._bgImg;
    },

});

你可能感兴趣的:(CocosCreator编码贴士:活用_isOnLoadCalled属性延迟代码执行时机)