2016-08-04 26 views
2

import TestClass from './TestClass'文字列をクラス名に変換するにはどうしたらいいですか?私は、文字列<code>'TestClass'</code>与えられ、このファイルに<code>TestClass</code>を参照するにはどうすればよい

eval('TestClass')TestClass is not definedので動作しません。

ただし、私がlet Test = TestClassを実行した後にeval('Test')を実行すると、希望通りにTestClassのコンストラクタが返されます。 eval('Test')がないとき

なぜeval('TestClass')は動作しませんか?

コンテキスト<div data-class="TestClass"></div>のような を考えると、多くの要素が、私は適切にそれらに部品を反応させるのレンダリングの一般的な関数を作成します。これらのコンポーネントクラスは、この関数を実行する前にファイルにインポートされます。

注:ビルドシステムとしてブランチ(webpackと同様)を使用する。

+0

あなたのパッケージシステムとは何ですか? Webpack?ブラウジング? –

+2

解決策をよく考え直してください。新しいモジュールシステムの要点は、静的に分析できるということです。動的に 'import 'することはできないので、動的にインスタンス化することはあまりありません。 – zerkms

+0

[MDN documentation](https://developer.mozilla.org/ja/docs/web/javascript/reference/statements/import)は、できることと達成できないことを助けますか? –

答えて

2

私はBrunchが何をするか分からないが、あなただけのインポート後にコンポーネントを持つオブジェクトを作成し、文字列の特定のコンポーネントを取得するためにそれを使用することができます。何かのように:

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] 
+0

ありがとう!これは動作します。 '['TestClass1'、 'TestClass2']'を指定して 'componentMap'を定義する自動化された方法はありますか? –

+0

@AlishanLadhani:No. –

+3

@AlishanLadhani 'const componentMap = {TestClass1、TestClass2};' <これは同じですが重複はありません。おかげさまで、 – zerkms

関連する問題