typescript 键盘事件:类型“EventTarget”上不存在属性“value”

but5z9lq  于 2023-04-22  发布在  TypeScript
关注(0)|答案(2)|浏览(212)

我从Angular页面复制了一些代码,可视化代码显示错误:
此行的错误:

map((e: KeyboardEvent) => e.target.value),

错误

Property 'value' does not exist on type 'EventTarget'.

Angular website代码:

import { fromEvent } from 'rxjs';
import { ajax } from 'rxjs/ajax';
import { map, filter, debounceTime, distinctUntilChanged, switchMap } from 'rxjs/operators';

const searchBox = document.getElementById('search-box');

const typeahead = fromEvent(searchBox, 'input').pipe(
  map((e: KeyboardEvent) => e.target.value),
  filter(text => text.length > 2),
  debounceTime(10),
  distinctUntilChanged(),
  switchMap(() => ajax('/api/endpoint'))
);

typeahead.subscribe(data => {
 // Handle the data from the API
});
9udxz4iz

9udxz4iz1#

因为Typescript不能推断事件类型。你需要显式地写出你的目标HTMLElement的类型。例如,如果它的类型是HTMLInputElement,那么你可以写下面一行:

map((e: KeyboardEvent) => (<HTMLInputElement>e.target).value),

这将解决你的问题。

drkbr07n

drkbr07n2#

尝试使用这种类型的输入,而不是KeyboardEvent使用ChangeEvent:

map((e: React.ChangeEvent<HTMLInputElement>) => e.target.value),

相关问题