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

问题描述 投票:0回答:1

我正在尝试使用rxjs来解决问题,当clientY大于200像素时,该问题将在文档上获得首次单击。

问题是,打字稿告诉我clientX不在事件类型中。您可以在下面看到它:

enter image description here

所以我试图在类似这样的参数中将事件类型设置为MouseEvent:

(event: MouseEvent)=> ({})

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

enter image description here

解决此怪异问题的最佳解决方案是什么?

更新:原因和答案:

enter image description here

感谢@Prince

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

因此,我们应该告诉它将事件强制转换为发生过的任何事件(在此示例中为MouseEvent),以便它可以根据需要工作,就像我们对html输入类型所做的那样,以防止在使用value时发生类型错误:] >

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

我正在尝试使用rxjs处理一个问题,当clientY大于200像素时,该问题将在文档上获得首次单击。问题是,打字稿告诉我clientX不在...

javascript typescript rxjs mouseevent typeerror
1个回答
1
投票

您可以通过以下操作符(fromEvent,pluc,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));
© www.soinside.com 2019 - 2024. All rights reserved.