未捕获（承诺中）ReferenceError 将 addEventListener 转换为 Typescript

Question

我开发了一个简单的网页，用于将文本输入发送到 XML RPC 服务器。我得到了在 Javascript 中工作的代码，但现在我试图将其全部转换为 Typescript 并使用带有 async/await 的 Promise。这是一个学习实验。事实证明，以我目前的经验水平，这有点困难。

以前工作的 Javascript 代码：

import "./mimic.js";
function makeComment() {
    const method = "MakeComm";
    let request = new XmlRpcRequest("http://localhost:1337/RPC2", method);
    request.addParam(document.getElementById("n1")).value;
    request.addParam(document.getElementById("n2")).value;
    let response = request.send();
    console.log(response);
}

正如我上面所说，这个函数与 XML RPC 服务器正确通信。这是我转换后的 Typescript 代码：

import "./mimic.js";
const updateCommentBtn: HTMLButtonElement = document.getElementById(
    'makeComment',) as HTMLButtonElement;

updateCommentBtn.addEventListener('click', async () => {
    const method = "MakeComm";
    let request:any = new XmlRpcRequest("http://localhost:1337/RPC2", method);
    request.addParam(<HTMLInputElement>document.getElementById("n1")).value;
    request.addParam(<HTMLInputElement>document.getElementById("n2")).value;
    let response = await request.send();
    console.log(response);
});

我收到一个错误：

Uncaught (in promise) ReferenceError: XmlRpcRequest is not defined
    at Object.<anonymous> (fileChange.ts:36)
    at new Promise (<anonymous>)
    at HTMLButtonElement.<anonymous> (fileChange.ts:34)

XmlRpcRequest 调用是一个包含在 ./mimic.js 中的函数。

我的 Typescript 版本的 HTML：

<p>Make Comment:</p>
<input type="text" id="n1"/>
<input type="text" id="n2"/>
<button id="makeComment">Update Comment</button>

编辑： mimic.js 对 XmlRpcRequest 的定义如下：

function XmlRpcRequest(url, method) {
    this.serviceUrl = url;
    this.methodName = method;
    this.crossDomain = false;
    this.withCredentials = false;   
    this.params = [];
    this.headers = {};
};

Answer 1

感谢您添加代码

你应该像这样在mimic.js中导出函数

export const XmlRpcRequest = (url, method) => {
    this.serviceUrl = url;
    this.methodName = method;
    this.crossDomain = false;
    this.withCredentials = false;   
    this.params = [];
    this.headers = {};
};

然后导入

import { XmlRpcRequest } from "./mimic";

如果你的 typescript linter 给你 gyp，你可以像这样为参数添加定义：

  export const XmlRpcRequest = (url: string, method: string) => {
        this.serviceUrl = url;
        this.methodName = method;
        this.crossDomain = false;
        this.withCredentials = false;   
        this.params = [];
        this.headers = {};
  };