Acabo de comenzar un nuevo proyecto de reacción con mecanografiado y tengo dificultades para definir un accesorio personalizado en un componente funcional.
Busqué cómo definir accesorios personalizados y encontré una forma de definir una interfaz que detalla el tipo de accesorio que estoy pasando a la función, pero cuando intento ejecutarlo en mi aplicación principal, aparece un error que dice
Escriba '{ dígito: número; }' no se puede asignar al tipo 'IntrinsicAttributes'. La propiedad 'dígito' no existe en el tipo 'IntrinsicAttributes'. TS2322
Mi código :
import React from 'react'; import Button from '@mui/material/Button'; export {} interface NumberButton { digit:number, } function NumberButton(props:NumberButton){ return ( <Button variant="contained" color="primary">{props.digit}</Button> ) } import React from 'react'; import ReactDOM from 'react-dom'; import ClearButton from './Components'; import NumberButton from './Components'; export default function App(){ return ( <div> <ClearButton/> <NumberButton digit={1}/> </div> ) }Estoy tratando de familiarizarme más con los componentes funcionales después de usar ganchos y estoy enganchado a usarlos.
export {}Actualmente no está exportando el componente NumberButton, por lo que eso es lo principal que debe corregirse. Además, está utilizando el mismo nombre de variable tanto para el componente como para los accesorios. Prueba esto:
import React from 'react'; import Button from '@mui/material/Button'; interface NumberButtonProps { digit: number, } function NumberButton(props: NumberButtonProps){ return ( <Button variant="contained" color="primary">{props.digit}</Button> ) } export default NumberButton;