编辑：更新以反映 React 16

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

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

更多信息：
https : //reactjs.org/blog/2017/09/26/react-v16.0.html#support-for-custom-dom-attributes
https://facebook.github.io/react/blog/ 2017/09/08/dom-attributes-in-react-16.html

上一个答案（React 15 及更早版本）

当前不支持自定义属性。有关更多信息，请参阅此未解决的问题：https : //github.com/facebook/react/issues/140

作为一种解决方法，您可以在以下内容中执行以下操作componentDidMount：

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

有关工作示例，请参阅https://jsfiddle.net/peterjmag/kysymow0/。（灵感来自 syranide 在此评论中的建议。）

您可以使用 ES6 扩展运算符添加属性，例如

let myAttr = {'data-attr': 'value'}

并在渲染方法中：

<MyComponent {...myAttr} />

考虑到您想传递一个名为myAttrvalue的自定义属性myValue，这将起作用：

<MyComponent data-myAttr={myValue} />

您可以使用“ is ”属性来禁用元素的 React 属性白名单。

在此处查看我的答案： Stackoverflow

如果您使用的是 es6，这应该有效：

<input {...{ "customattribute": "somevalue" }} />