Wie verwandle ich einen String in einen Klassennamen (ohne ihn im Fenster zu definieren)?

Question

import TestClass from './TestClass'

Wie kann ich TestClass in dieser Datei die Zeichenfolge 'TestClass' gegeben verweisen?

eval('TestClass') funktioniert nicht, weil TestClass is not defined.

Jedoch, wenn ich let Test = TestClass, und dann eval('Test') mache, gibt es mir den Konstruktor für TestClass zurück, wie gewünscht.

Warum funktioniert eval('TestClass') nicht, wenn eval('Test') funktioniert?

Kontext: Da viele Elemente wie <div data-class="TestClass"></div>, ich möchte eine generische Funktion erstellen, die die entsprechenden in sie reagieren Komponenten macht. Diese Komponentenklassen werden vor Ausführung dieser Funktion in die Datei importiert.

Hinweis: Verwenden Sie Brunch (ähnlich wie Webpack) als Build-System.

Answer 1

Ich weiß nicht, was Brunch tut, aber Sie können einfach ein Objekt mit Komponenten nach dem Importieren erstellen und verwenden, um die Komponente mit einer Zeichenfolge abgerufen. Etwas wie:

import TestClass1 from './TestClass1' 
import TestClass2 from './TestClass2' 

const componentMap = { 
    TestClass1: TestClass1, 
    TestClass2: TestClass2 
} 

// You can just use the map to get the component given the name 
const component = componentMap[componentName]