Objet de passage comme accessoires à jsx

Question

J'ai un objet contient plusieurs accessoires de valeur clé commune, que je veux transmettre à certains jsx. Quelque chose comme ceci:

Je veux que cela fonctionne comme des accessoires individuels de passage:

Est-ce possible?

Answer 1

Est-ce possible?

Oui, pourquoi vous pensez que ce n'est pas possible, mais la façon dont vous êtes l'envoi n'est pas correct.

Sens de l' <MyJsx commonProps /> est:

<MyJsx commonProps={true} />

Donc, si vous ne spécifiez aucune valeur par défaut, il prendra true. Pour passer de l'objet, vous devez l'écrire comme ceci:

const commonProps = {myProp1: 'prop1',myProp2: 'prop2'};
<MyJsx commonProps={commonProps} />

Mise à jour:

Si vous avez un objet et veut transmettre toutes les propriétés distinctes prop, de l'écrire comme ceci:

<MyJsx {...commonProps} />

Answer 2

Vous pouvez utiliser l'opérateur de propagation pour ce faire.

Maintenant, ce que toutes les propriétés individuelles que vous avez en commonProps seront envoyés comme accessoires individuels à MyJsx

Answer 3

Vous devez utiliser des doubles accolades, comme ceci:

Ou pour passer de nombreux objets :

C'est tout simplement la syntaxe JS à l'intérieur des accolades.

Un dernier composant pourrait ressembler à ceci

Answer 4

Vous pouvez passer accessoires comme objet de deux façons:-

const commonProps - 'myProp1: 'prop1',myProp2: 'prop2';

1.Utilisation de l'opérateur de propagation:-

2.Simplement passer que les accessoires:-