javascript - Rxjs v6.x 上的类型 'clientX' .ts(2339) 上不存在属性 'Event'

Question

我正在尝试使用 rxjs 来处理当 clientY 大于 200px 时第一次单击文档的问题。

问题是， typescript 告诉我 clientX 不在事件类型中。您可以在下面看到:

所以我尝试在参数中将事件类型设置为 MouseEvent，例如:

(event: MouseEvent)=> ({})

但它给了我另一个错误，似乎问题出在 rxjs 上，它无法检测到单击事件与简单事件不同；

解决这个奇怪问题的最佳解决方案是什么？

更新:原因和答案:

感谢@Prince

我发现，fromEvent 仅发出“事件类型”，这意味着它可以告诉我们哦，我收到了一个事件。

因此，我们应该告诉它将事件转换为已发生的事件(在本例中是 MouseEvent)，这样它就可以按照我们想要的方式工作，就像我们对 html 输入类型所做的那样，以防止使用值时出现类型错误:

const search_elm = document.getElementById("search")! as HTMLInputElement;
search_elm.value="10";

Answer 1

您可以使用运算符(fromEvent、pluck、filter、first)来实现此目的，如下所示。请查找内联说明。

const source = fromEvent(document, 'click')
.pipe(
  map(event => {
    const e = event as MouseEvent;
    return {x: e.clientX, y:e.clientY};
    }),
  filter((obj) => obj.y > 200),
  first(),
);

source.subscribe(x => console.log(x));

这里是工作 stackblitz 链接:https://stackblitz.com/edit/rxjs-ccrz9x