2016-04-26 20 views
0

Ich bin zuversichtlich, dass dies auch nicht möglich ist, es funktioniert nicht loldynamischer Import mit forEach js es2015

ich webpack bin mit mit babel-preset-es2015 & babel-preset-react und versucht, dynamisch eine Form zu bauen zwischen den Routen unter Verwendung von Daten weitergegeben .

Seitenladen < Form />

 <Form data={ 
      [ 
       { 
        element: 'input', 
        type: 'text', 
        placeholder: 'Jamie is Sex' 
       }, 
       { 
        element: 'input', 
        type: 'text', 
        placeholder: 'Jamie is Not Sex' 
       }, 
       { 
        element: 'input', 
        type: 'password', 
        placeholder: 'Jamie is Not Sex' 
       } 
      ] 
      }/> 

< Form />/form.js

var buildElements = this.props.data.map(function (item) { 
     var element = import item['type'] from './'+item['type']; 
     return element; 
    }); 

Ich weiß, ich könnte eine if-Anweisung tun, aber ich möchte es verlassen auf dem Dateisystem. Vielleicht muss ich prüfen, ob die Datei mit Knoten existiert.

+0

Nein, dies ist mit ES2015 nicht möglich: http://stackoverflow.com/questions/30340005/importing-modules-using-es6-syntax-and-dynamic-path Werfen Sie einen Blick auf Webpack oder browserify mit CommonJS-Syntax stattdessen. – nils

Antwort

0

Sie sollten so etwas wie

const buildElements = this.props.data.map(item => require('./' + item.type)); 

meist Javascript-Packer (webpack, Rollup und browserify) können auch diese (nicht-ES6) Syntax tun verstehen.