Currently, I am facing an issue where I have a declared function type with generics that I want to assign to a named arrow function. Below is an example of the code:
import { AutocompleteProps } from '@material-ui/lab/Autocomplete';
const itemToString: AutocompleteProps<
T,
Multiple,
DisableClearable,
FreeSolo
>['getOptionLabel'] = (i) =>
(typeof i === 'string' ? i : (i?.name as string)) || '';
However, TypeScript is giving me a warning that it cannot find the
T, Multiple, DisableClearable, FreeSolo
generics.
Can anyone advise me on where I should properly define them?
Edit: My goal is to pass this function to the getOptionLabel
prop of an Autocomplete
component call and inherit its generics. Is there a way to achieve this, or should I consider following Rajiv's answer?
Edit2: I have also tried something similar to the following, but it does not seem to work:
const itemToString: <
T extends Entity,
Multiple extends boolean,
DisableClearable extends boolean,
FreeSolo extends boolean
> AutocompleteProps<
T,
Multiple,
DisableClearable,
FreeSolo
>['getOptionLabel'] = (i) => (typeof i === 'string' ? i : (i?.name as string)) || '';