Comment rendre dynamiquement des composants par type dans React ?

Rendu dynamique des composants par type

Problème :

Développer des composants dynamiques en fonction de leur type présente un défi où la simple concaténation une chaîne avec "Component" entraîne une syntaxe incorrecte. Créer de nouvelles méthodes pour chaque composant afin de résoudre ce problème demande beaucoup de travail.

Solution :

Utiliser une approche moderne suggérée par la documentation officielle de ReactJS :

const Component = React.createElement(type, props);

Explication :

Au lieu d'utiliser la concaténation de chaînes méthode, qui attend une balise HTML ou une fonction ReactClass, la solution ci-dessus utilise directement React.createElement. Il accepte deux paramètres : le type de composant sous forme de chaîne ou de fonction et un objet facultatif avec les accessoires du composant. Cette approche élimine le besoin de nommer les variables avec des lettres majuscules et fournit une solution plus élégante.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!