Búsqueda de sitios web

reactjs - typescript genéricos: ¿qué significa <T,>?


Intento entender el código (parte de una aplicación React):

interface SearchProps<T> {
  className?: string;
  value?: T;
  options?: T[];
  onChange?: (event: object, value: T | string, reason: string) => void;
  onInputChange?: (event: object, value: string, reason: string) => void;
  onClear?: () => void;
  renderOption?: FC<T>;
  getOptionLabel?: (option: T) => string;
}

interface TranslatedSearchProps<T> extends SearchProps<T> {
  t?: TFunction;
}

export const PureSearch = <T,>({
  className,
  value,
  options,
  onChange,
  onInputChange,
  onClear,
  renderOption,
  getOptionLabel,
  t = (key: string) => key,
}: TranslatedSearchProps<T>) => {
  return (
    <Autocomplete
      className={className}
      freeSolo
      disableClearable
      options={options || []}
      value={value}
      onChange={onChange}
      onInputChange={onInputChange}
      renderInput={SearchAppBar(t, onClear)}
      renderOption={
        renderOption ||
        ((option: T) => <ListItemText primaryTypographyProps={{ variant: 'h6' }} primary={option} />)
      }
      getOptionLabel={getOptionLabel || ((o: T) => `${o}`)}
    />
  );
};

Respuesta #1

Prácticamente en cualquier lugar en JS, puedes dejar una coma al final en una declaración de estilo lista y el analizador la ignorará. [0,1,2,] da el mismo resultado que [0,1,2], { a: true, } es igual a { a: true }, etc.

Como comentó Jared Smith, la coma, en este caso, aclara al analizador que esto es un parámetro de tipo, no un marcado JSX. Normalmente, sin embargo, esto no tendría ningún efecto en la ejecución.

Artículos relacionados