将TypeScript回调函数挂载到窗口对象

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (348)

我得到了一个工作的HTML页面,其JS代码看起来像这样:

<script type="text/javascript">
    function nativeThingEventHandler(event) {
        console.log("event received: " + event);
    }

    window.onload = function() {
        if (typeof nativeThing !== "undefined") {
            console.log("Native thing was found");      
            nativeThing.setListener("nativeThingEventHandler");
        }
    }
</script>

如果nativeThing是HTML外部的本机对象,那么就调用nativeThingEventHandler(正如你所看到的那样,在JS代码的顶层定义)回调。我需要将这个HTML页面集成到React Typescript项目中,我是TypeScript的新手。我无法实现该nativeThingEventHandler功能,因此可以找到它nativeThing,因此当nativeThing对象发回事件时我不断收到错误。如何在typescript中定义事件处理程序,以便在构建项目之后,可以在JS代码的顶层找到它?

再解释一下: nativeObject的API需要setListener方法中的字符串,然后期望在Javascript的顶层(不在任何其他函数内)中存在与该字符串同名的函数。所以这个问题具体是关于如何编写一个打字稿函数,一旦编译,将导致函数被放置在javascript的顶层。

提问于
用户回答回答于

一个不太好的解决方法是将您的回调函数window手动分配给下面的变量:

import { nativeThingEventHandler } from 'somewhere';

(window as any).nativeThingEventHandler = nativeThingEventHandler;

扫码关注云+社区

领取腾讯云代金券