[React] Virtual DOM disallow custom attributes

For example,

render: function() {
  return <div transition-state="opening"></div>;
}

Will give you a div</code> without the transition-state</code> attribute.

One of the workaround is using dataset.

render: function() {
  return <div data-transition-state="opening"></div>;
}

Another is changing the attribute dynamically whenever componentDidUpdate</code> callbacks.

Note

• tabindex in JSX is tabIndex.
• class in JSX is className.