变量而不是节点名称

Question

如何在jsx中使用渲染中使用JavaScript变量而不是节点名？像这样的东西:

var First = React.createClass({
  render: function() {
    var nodeName = this.props.node; // this.props.node = 'Second';
    return <{nodeName}/>;
  }
});
var Second = React.creactClass({/*...*/});

Answer 1

在这种情况下,不要使用JSX.

var First = React.createClass({
  render: function() {
    var nodeName = this.props.node; // this.props.node = 'Second';
    return React.createElement(nodeName);
  }
});
var Second = React.createClass({/*...*/});

当编译成Vanilla JS时,这最终是JSX的结果.