我可能错过了一些东西，但这里是。如果我有：
var Swoosh = React.createClass({
render: function() {
return (
<div className="swoosh">
Boom.
</div>
);
}
});
React.renderComponent(
<Swoosh />,
document.getElementById('content')
);
我可以props在挂载点（ where id='content'）上设置为属性吗？
<div id='content' foo='alice' bar='has' bav='a cat' />
<!-- have foo, bar & bav available as props in <Swoosh />? -->
不，当然你可以这样做：
var container = document.getElementById('content');
React.renderComponent(
<Swoosh
foo={container.getAttribute('foo')}
bar={container.getAttribute('bar')}
bav={container.getAttribute('bav')} />,
container
);
（或者，如果您想使用https://stackoverflow.com/a/5282801/49485 之类的内容制作属性字典，那么您可以这样做Swoosh(attributes)）。
API 中没有任何东西可以将属性从普通 DOM 元素传输到 React 组件，但您可以创建一个 Mixin 来完成它。请注意，这仅适用于传递给的组件，renderComponent因为它使用setProps：
(工作 JSFiddle )
var InheritsDomAttributes = {
componentDidMount: function(rootNode) {
var hasNextProps = false;
var nextProps = {};
var parentNode = rootNode.parentNode;
Object.keys(parentNode.attributes).forEach(function(key) {
var namedNode;
// NamedNodeMaps have an attribute named "length" that
// should not be considered a set attribute.
if (key !== "length") {
hasNextProps = true;
namedNode = parentNode.attributes[key];
nextProps[namedNode.name] = namedNode.value;
}
});
if (hasNextProps) this.setProps(nextProps);
}
};
var Swoosh = React.createClass({
mixins: [InheritsDomAttributes],
render: function() {
return (
<div className="swoosh">
Boom.
</div>
);
}
});
React.renderComponent(
<Swoosh />,
document.getElementById('content')
);
有一种替代方法可以通过在 html 中使用数据属性来实现这一点。这是一个小例子：在 html 中，您可以根据需要添加尽可能多的带有数据前缀的属性：
<div id="root" data-prop-one="Property one" data-prop-two="Property two"/>
所有数据属性将自动转换为元素属性中的 CamelCaseddataset属性。将此属性传递给您的 React 组件，您就完成了：
let element = document.getElementById('root')
ReactDOM.render(<App myPropsObject={element.dataset}/>, element)