将字符串呈现为React组件

Question

我想用一个字符串渲染react组件作为我从另一个页面动态接收的输入。 BUt我将有反应组件的参考。 这是示例

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}
 }

});

在这个例子中，我接收Header组件作为字符串，并且我在接收页面中引用了Header组件。如何用实际的反应成分替换字符串

Answer 1

这个react-jsx-parser组件看起来会解决您的问题

Answer 2

使用您可以使用的字符串渲染反应组件。

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

有关更多信息，请查看此处的回复： React / JSX Dynamic Component Name

Answer 3

如果您可以将所有组件放在一个模块中，那么这非常有效：

#

通配符导入的工作方式类似于削减组件注册表。