如何在JSX中添加自定义html属性

Question

背后有不同的原因，但是我想知道如何简单地向JSX中的元素添加自定义属性？

Answer 1

编辑：更新以反映React 16

React 16本机支持自定义属性。这意味着向元素添加自定义属性现在就像将其添加至render函数一样简单，如下所示：

render() {
  return (
    <div custom-attribute="some-value" />
  );
}

先前的答案（第15和更早版本）

当前不支持自定义属性。有关更多信息，请参见此未解决的问题：

解决方法是，您可以在中执行以下操作componentDidMount：

componentDidMount: function() {
  var element = ReactDOM.findDOMNode(this.refs.test);
  element.setAttribute('custom-attribute', 'some value');
}