Estoy creando una aplicación con React y TypeScript.
Estoy pasando mis datos a un componente secundario usando accesorios
Declaré el tipo de datos de la propiedad como una interfaz en el componente principal
que se transmite al componente hijo
pero me sale error que no corresponde
Componente principal
interface IProperty { property: { title: string; }[]; } const Dashboard = () => { const [loading, setLoading] = useState(true); const [properties, setProperties] = useState<IProperty["property"]>([ { title: "New estate" } ]); return ( <div className="__recent-upload"> <ListOfProperties loading={loading} datas={properties} /> </div> ) export default DashboardComponente hijo
interface IProperty { property: { title: string; }[]; } const ListOfProperties: React.FC<{ loading: boolean, datas: IProperty }> = ({ loading, datas }) => { return ( <div> <h4 className="ml-4">Newly uploaded Properties</h4> <Skeleton active loading={loading}> <div className="table"> </div> </Skeleton> </div> ); }; export default ListOfProperties;Error
TS2741: Property 'property' is missing in type '{ title: string; }[]' but required in type 'IProperty'.Tiene dos soluciones posibles para eso: 1- usar el mismo tipo para useState
const [properties, setProperties] = useState<IProperty>([{ property: { title: "New estate" } }]);2- o pasar por alto el objeto correcto a accesorios
<ListOfProperties loading={loading} datas={ {property:properties} } />Su error proviene del hecho de que data esperan un objeto completo con una clave de property . Pero solo envía una matriz [ {title: "foo" } ] .