Traduction : React - affectation de déstructuration TypeScript des accessoires

Question

J'ai une fonction

fonction d'exportation getSubjectsForStudent(data: any) : any[]

L'"argument de données" est ce que je reçois d'une source externe et définir un type fort n'est pas réalisable. "return" est dérivé de "data", il est donc également de type any.

Un composant "Principal" transmet le "retour" à un composant "enfant", comme ceci :

;

<MainCategories subject={getSubjectsForStudent(data)} />

Et dans le composant MainCategories,

exporter la fonction par défaut MainCategories(props: any) {
    const tmp = props.subjects;
    ...
Traduction : Cela fonctionne, pas de problème. 
Mais je veux : 
export default function MainCategories( {subjects} ) {
Quelqu'un peut-il m'aider ? 

            

Answer 1

Vous devez ajouter un type ou une interface d'accessoires, puis vous pouvez obtenir des sujets via la déstructuration.

interface Props {
  subjects: any
}

export default function MainCategories({ subjects }: Props) {
    const tmp = props.subjects;
    ...

Answer 2

J'utilise souvent ce modèle pour y parvenir, mais la clé principale est de définir les accessoires.

import { FunctionComponent } from 'react';

interface Props {
  // In your case
  subjects: any
}

const MainCategories: FunctionComponent<Props> = ({subjects}) => (
  ...
);

export default MainCategories;