react.js样式的组件:添加HTML属性

可以使用属性排列操作符:

let props = condition ? {tabIndex: 1} : {};
let div = <div {...props} />

或者你可以查看他们的文档 Guide

例子:

React始终为DOM提供以javascript为中心的API。由于react组件通常同时使用自定义和与dom相关的属性,因此react使用camelcase约定,就像domAPI一样:

<div tabIndex="-1" />      // Just like node.tabIndex DOM API
<div className="Button" /> // Just like node.className DOM API
<input readOnly={true} />  // Just like node.readOnly DOM API

除了上面记录的特殊情况外,这些属性与相应的HTML属性工作类似。

您可以直接向样式化组件添加tabindex,它必须是camelcase: <PlayButton className={className} onClick={handleClick} tabIndex="0" />

在反应文档中: https://reactjs.org/docs/dom-elements.html