在我基于 ReactJS 的应用程序中，我这样做：
var _ = React.DOM;
_.span(null, 'some text', _.select(null, ...));
问题是：“一些文本”包含在 DOM 中的附加 span 元素中。有什么办法可以避免这种行为而只输出原始文本？
要明确：我想输出
<span>some text<select>...</select></span>
不是
<span><span>some text</span><select>...</select></span>
更新：这在React v15 (2016-04-06) 中现已“修复” ——现在注释节点被添加到每段文本周围，但不再包含在<span>标签中。
我们收到了来自社区的一些惊人的贡献在此版本中，我们想强调这种拉请求由迈克尔Wiencek尤其如此。感谢 Michael 的工作，React 15 不再
<span>在文本周围发出额外的节点，使 DOM 输出更加清晰。这对 React 用户来说是一个长期的烦恼，因此接受它作为外部贡献是令人兴奋的。
这是 React 目前的技术限制；它将任何浮动文本节点包装在一个跨度中，以便它可以为其分配一个 ID 并在以后引用它。希望在 React 的未来版本中我们可以取消这个限制。
作为最后的手段，您可以对 html 进行硬编码。
<option value={value} dangerouslySetInnerHTML={{__html: value}}></option>
好吧..如果你一心想要这样做，并接受你不能访问 props 或 state 的限制，你可以这样做：
var Component = React.createClass({
displayName:"Statics",
statics: {
customRender: function(foo) {
return React.renderToStaticMarkup(<div
dangerouslySetInnerHTML={{__html: foo.bar }}/>);
}
},
render: function () {
return <div dangerouslySetInnerHTML={{__html:
<Component.customRender bar="<h1>This is rendered
with renderToStaticMarkup</h1>" />}} />
}
});
renderToStaticMarkup 不会插入任何跨度或 react-dataid，并且用于静态服务器渲染。这样做可能不是一个好主意，但你去了。
renderToStaticMarkup 与renderToString类似，不同之处在于它不会创建 React 内部使用的额外 DOM 属性，例如 data-react-id。如果您想将 React 用作简单的静态页面生成器，这很有用，因为剥离额外的属性可以节省大量字节。
我更改了 react 和 react-dom 的版本并且完美运行
"react": "^15.0.1",
"react-dom": "^15.0.1"