Wie kann ich React-Komponenten in JSX dynamisch benennen?

React-Komponenten in JSX dynamisch benennen

Bei der React-Entwicklung kann es von Vorteil sein, Komponenten basierend auf ihrem Typ dynamisch zu rendern. Versuche, Array-Syntax zu verwenden oder für jede Komponente eine neue Methode zu erstellen, können jedoch zu Fehlern oder ausführlichem Code führen.

Elegante Lösung

Eine elegantere Lösung ist das Speichern die Komponentenklasse in einer Variablen mit einem Großbuchstaben am Anfang. Dies folgt der Konvention „HTML-Tags vs. React Components“. Zum Beispiel:

var MyComponent = Components[type + "Component"];
return <MyComponent />;

Dies wird zu Folgendem kompiliert:

var MyComponent = Components[type + "Component"];
return React.createElement(MyComponent, {});

Alternativ können Sie den in der offiziellen Dokumentation empfohlenen Ansatz verwenden, der darin besteht, den Komponententyp zur Laufzeit anzugeben:

return React.createElement(type, { /* props */ });

Das obige ist der detaillierte Inhalt vonWie kann ich React-Komponenten in JSX dynamisch benennen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!