如何将打字稿中的目标设置为rxjs中的fromEvent（）

Question

我在打字稿旁使用'rxjs'库。问题是，我不知道如何将简单按钮从rxjs []传递给rxjs

尝试这样做会使编译器抱怨：

fromEvent()
这将引发以下异常：

[HTMLElement类型的参数| null'不可分配给参数类型为'FromEventTarget'。类型“ null”不可分配给输入“ FromEventTarget”。 TS2345

fromEvent()

我尝试根据文档将定义更改为节点列表：

DOM节点列表，例如由document.querySelectorAll返回或Node.childNodes。

尽管此集合本身不是事件目标，但fromEvent将遍历它包含的所有节点并安装事件处理程序功能在每个人中。返回Observable退订后，函数将从所有节点中删除。

import React from 'react';
import * as rx from 'rxjs';

const RXComponent: React.FC = () => {

    rx.fromEvent(document.getElementById('dblbutton'), 'click')

    return (
        <form>
            <input type='button' id='dblbutton' value='Click me!'>
            </input>
        </form>
    )
}

export default RXComponent;

[从技术上讲，它可以正常工作并阻止编译器发出抱怨，但是，如果我在localhost上打开实际的网站，则会得到一堆引用该库的错误。

知道我在做什么错吗？

我在打字稿旁使用'rxjs'库。问题是，我不知道如何从rxjs传递一个简单的按钮到fromEvent（）。 ...

Answer 1

您可能使用

const btn = document.querySelectorAll('#dblbutton')
const obs = rx.fromEvent(btn, 'click')
obs.subscribe(x => console.log(x))

回调模式执行了类似的操作，该回调模式将为您传递实际的元素引用，看看是否对您有用：