FineUI-100-Questions/questions/38.绑定listeners时候this的新写法.md

绑定listeners时候this的新写法

FineUI中事件体系,借用listeners进行事件通知. 在绑定事件的时候,有的同学喜欢使用箭头函数,有的同学喜欢使用传统function() 并无优劣,唯一需要注意的即是this指向问题

先看一个示例

class Widget extends BI.Widget {
    
    render() {
        const self = this;

        const widget = {
            type: "bi.multi_select_item",
            ref: ref => this.itemRef = ref,
            text: "复选item",
            listeners: [
                {
                    eventName: BI.MultiSelectItem.EVENT_CHANGE,
                    actin: () => {
                        this.fireEvent("EVENT_CHANGE", this.itemRef.isSelected())
                    }
                }, {
                    eventName: BI.MultiSelectItem.EVENT_CHANGE,
                    actin: function () {
                        self.fireEvent("EVENT_CHANGE", this.isSelected())
                    }
                }
            ]
        }
    }
}

相信大家能看出两个listener的区别, 一个可以省掉self,但是需要ref,一个不需要self可以直接通过this访问组件