2
votes

Paramètre de composant sans état ReactJS

Quel est le choix préféré / correct pour le paramètre du composant sans état ReactJS? S'agit-il des accessoires ou de la liste de tous les noms d'accessoires?

Choix 1:

const Checkbox = ({name, value}) => {}

Choix 2:

const Checkbox = props => {}


1 commentaires

C'est à vous. aucune différence de performance. juste lié au style de codage.


4 Réponses :


0
votes

Il n'y a pas de choix incorrect ici.

Si vous n'avez que quelques accessoires, comme dans votre exemple name et value , vous pouvez les déstructurer. Si vous avez plus de 10 accessoires, je pense qu'il est préférable d'utiliser uniquement des accessoires , puis de travailler avec eux dans le corps du composant, juste à cause du style visuel.


0 commentaires

0
votes

La manière dont vous souhaitez utiliser votre composant dépend de la manière dont votre composant est implémenté et c'est aussi une question de préférence personnelle. Le composant fonctionnel est passé comme props comme argument post que vous préférerez peut-être l'utiliser tel quel ou le déstructurer

Choix 1: const Checkbox = props => {}

Le plus souvent, vous pouvez utiliser la méthode ci-dessus lorsqu'il y a trop d'accessoires que vous souhaitez utiliser ou les transmettre tous au composant enfant

Choix 2: const Checkbox = ({name, value}) => {}

Le modèle ci-dessus est l'endroit où vous déstructurez le nom et la valeur des accessoires. Vous pouvez choisir de le faire lorsque vous n'avez besoin d'utiliser que name et value parmi tous les accessoires passés


0 commentaires

0
votes

Je ne pense pas qu'il existe une manière préférée / correcte de le faire Je pense que la règle d'or devrait être le nombre de paramètres. si vous avez plus de 6 paramètres, le code commence à avoir l'air désordonné vous pouvez toujours utiliser l'affectation de déstructuration d'objets dans votre composant


0 commentaires

0
votes

le choix vous appartient, les deux méthodes sont bonnes, utilisation basée sur le composant

1) que vous pouvez utiliser lorsque le composant est gros (utilisez plus d'accessoires):

Choix 1: const Checkbox = props => {}

2) que vous pouvez utiliser lorsque le composant est petit et nécessite 2 ou 3 accessoires

Choix 2: const Checkbox = ({name, value}) => {}

il n'y a pas de standard pour utiliser lequel, tout dépend de vous, mais lorsque le composant est grand, utilisez le choix-1 qui rend le code plus propre.


0 commentaires