0
243
ViewsApoyos de botón de extensión MUI
Quiero extender los componentes de MUI5 y también usar su accesorio de component . Para hacerlo de acuerdo con la documentación , lo hago funcionar en el siguiente código:
import Button, { ButtonProps } from '@mui/material/Button'; import React from 'react'; export type MyButtonProps<C extends React.ElementType> = ButtonProps<C, { component?: C }> & { myOtherField: string; }; export function MyButton<C extends React.ElementType>(props: MyButtonProps<C>) { const { myOtherField, ...buttonProps } = props; return <Button {...buttonProps}></Button>; } Sin embargo, cuando trato de acceder a algo que pertenece a los atributos del botón MUI5, vscode no me ayuda a encontrarlo, vea la siguiente captura de pantalla: 
Pero después de agregarlo manualmente, no se queja. vea la captura de pantalla a continuación y verifique que esté infiriendo el tipo como any
Sin embargo, si elimino la lógica <C extends React.ElementType> del tipo, funciona de maravilla (pero tiene un inconveniente, ya que ahora se queja del accesorio del component cuando lo uso en cualquier parte de mi aplicación):
¿Cuál puede ser la parte problemática en primer lugar cuando extiendo los tipos de accesorios de botón MUI5?
gracias de antemano.
1 answers
Answer question0
Esta es la manera fácil que encontré para su caso de uso:
type NewButtonProps = ButtonProps & { otherField: number; component: React.ElementType; }; function Button3({ otherField, ...props }: NewButtonProps) { const y = props.onClick; const x = otherField; return <Button {...props}></Button>; }Todos los atributos se entienden por mecanografiado ahora:
