Type error when casting link-like items

Aperta
#1,568 3 commenti 2 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
45/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
react, tailwindcss, typescript
Ambito
frontend

Direzione di ricerca

Parti dalle definizioni delle prop di SidebarItem e NavbarItem, in particolare dalla sostituzione di ThemingProps mostrata nell’issue, e confrontale con l’esempio di Link personalizzato. Esegui i controlli TypeScript del progetto con un componente simile a un link; il lavoro è completato quando le prop del componente base, come to, vengono accettate senza errori di tipo.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Steps to reproduce

Create an element like a SidebarItem or NavbarItem and override the base element. For example, Remix/React Router has a custom Link element that enables client-side routing:

<SidebarItem
  as={Link}
  to="/settings"
>
  Settings
</SidebarItem>

Current behavior

While the code itself works, typescript gives an error like the following:

TS2322: Type '{ children: string; as: ForwardRefExoticComponent<LinkProps & RefAttributes<HTMLAnchorElement>>; to: string; icon: ForwardRefExoticComponent<...>; className: string; }' is not assignable to type 'IntrinsicAttributes & SidebarItemProps & RefAttributes<Element>'.
  Property 'to' does not exist on type 'IntrinsicAttributes & SidebarItemProps & RefAttributes<Element>'.

Expected behavior

Typescript should allow passing the base components' props without an error.

Context

Typechecking only.

Note, these components' proptypes previously extended Record<string, unknown>, but that was replaced with ThemeingProps<ComponentTheme>.

For example:

export interface SidebarItemProps extends Omit<ComponentProps<"div">, "ref">, 
Record<string, unknown> {}

but this has now been replaced with:

export interface SidebarItemProps extends Omit<ComponentProps<"div">, "ref">, ThemingProps<SidebarItemTheme> { };
Lingua principale
TypeScript
Stelle
2.2k
Fork
504
Merge medio
19h 16m
PR unite (30g)
2

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di themesberg/flowbite-react

Tutte le issue di themesberg/flowbite-react

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.