Is there a right way to pass data into a React component from the HTML page?

I have used data- attributes for various props, then passed all the props using destructuring {...dataset}, for example:

HTML:

<div id="app" data-feed='custom_feed.json' data-someprop='value'></div>

JS:

var root = document.getElementById('app');
ReactDOM.render(<X {...(root.dataset)} />, root);

Edit: demo fiddle
Edit 2018: updated fiddle