文字列をReactコンポーネントとしてレンダリングする

Question

私は、別のページから動的に受け取っている入力として文字列を使って反応コンポーネントをレンダリングします。私は反応コンポーネントのリファレンスを持っています。 は、ここで私は、文字列としてヘッダーコンポーネントを受けています。この例では例

Page1: 
----------------------------- 
loadPage('<div><Header value=signin></Header></div>'); 

Page2: 
-------------------------------- 
var React =require('react'); 
var Header = require('./header'); 

var home = React.createClass({ 

loadPage:function(str){ 

      this.setState({ 
      content : str 
      }); 

    }, 

render : function(){ 

    return {this.state.content} 
} 

}); 

ある、と私は私の受信ページのヘッダー・コンポーネントの参照を持っています。文字列を実際の反応成分で置き換えるにはどうすればいいですか？

Answer 1

反応成分を文字列で表現するには、使用することができます。詳細については

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

ここでの応答を確認してください。 React/JSX Dynamic Component Name

Answer 2

を使用すると、1つのモジュールにすべてのコンポーネントを持って生きることができるならば、これはかなりうまく機能：

import * as widgets from 'widgets'; 
    var Type = widgets[this.props.componentId]; 
    ... 
    <Type /> 

ワイルドカードのインポートをカット率のコンポーネントレジストリのように機能します。

Answer 3

このreact-jsx-parserのコンポーネントは、問題を解決するように見えます。