Type '(event: FormEvent<HTMLInputElement>) => void' is not assignable to type '() => any'
13,866
Ah just fixed it:
import React from 'react'
interface IProps {
handleSearchTyping(event: React.FormEvent<HTMLInputElement>): void;
}
export const SearchInput = (props: IProps) =>
<input type="text" placeholder="Search here" onChange={props.handleSearchTyping} />;
Needed to use the event: React.FormEvent<HTMLInputElement>
type.
Related videos on Youtube
Author by
Leon Gaban
Investor, Powerlifter, Crypto investor and global citizen You can also find me here: @leongaban | github | panga.ventures
Updated on June 04, 2022Comments
-
Leon Gaban almost 2 years
Type '(event: FormEvent) => void' is not assignable to type '() => any'.
In my parent component I'm just passing in a function which handles onChange to the child:
<SearchInput handleSearchTyping={this.handleSearchTyping}/>
@bind handleSearchTyping(event: React.FormEvent<HTMLInputElement>) { const target = event.target as HTMLInputElement; const { value: searchText } = target; const search = (text: string) => { const { searchList } = this.state; const searchedCoins = findAsset(text, searchList); this.setState({ searchList: searchedCoins }); }; const clearSearch = () => { this.setState({ searchList: this.state.saved }); }; const handleUpdate = (num: number) => (num > 1 ? search(searchText) : clearSearch()); return handleUpdate(searchText.length); }
The child: SearchInput:
import React from 'react' export const SearchInput = (props: { handleSearchTyping(): void }) => <input type="text" placeholder="Search here" onChange={props.handleSearchTyping} />;
Also tried:
interface IProps { handleSearchTyping(): void; } export const SearchInput = (props: IProps) => <input type="text" placeholder="Search here" onChange={props.handleSearchTyping} />;
What is the correct type to past into the props of
SearchInput
?