海口官网设计公司_上海企业地址大全_口碑营销的重要性_潍坊seo网络推广

场景描述

# 接口
export interface Event {onChange: (type: string, item: Item) => void;
}# 实现event: Event = {onChange(type: string, item: Item): void {...}};

实现中代码的this，指向的是组件中的变量；而接口实现类收到回调的环境中，this并非指向组件，调试过程中可以看到所有的值都为undefined。

网上搜的可用的解决办法

总结：让this指向组件

在JavaScript中，函数的this指向是动态的，取决于函数的调用方式。通常，如果一个函数被作为对象的方法调用，this指向这个对象。然而，如果函数被作为回调使用（比如作为事件监听器、setTimeout、setInterval的参数、map、filter、reduce等函数的参数等），this可能不会指向你期望的上下文（例如，可能指向全局对象或者在严格模式下是undefined）。

解决方法：

使用箭头函数：箭头函数没有自己的this，它会捕获其在定义时所处的this值

element.addListener('click', () => {// 在这里，this 指向 element 对象
});

修改后代码：

    event: Event = {onChange: (type, item) => {...}};