No more dangerouslySetInnerHTML, render HTML as React element.
It renders a provided HTML string into a React element.
import renderHTML from 'react-render-html';
renderHTML("<a class='github' href='https://github.com'><b>GitHub</b></a>")
// => React Element
// <a className="github" href="https://github.com"><b>GitHub</b></a>It may be used in the render method in a React component:
let App = React.createClass({
render() {
return (
<div className='app'>
{renderHTML(someHTML)}
</div>
);
}
});Or just by itself
ReactDOM.render(renderHTML(someHTML), document.getElementById('app'));If a provided HTML contains several top-level nodes, the function will return an array of React elements.
renderHTML('<li>hello</li><li>world</li>');
// => [React Element <li>hello</li>, React Element <li>world</li>]Install with NPM:
npm i --save react-render-html
Import with CommonJS or whatever:
const renderHTML = require('react-render-html');
import renderHTML from 'react-render-html';When a bug is found, please report them in Issues.
Also, any form of contribution(especially a PR) will absolutely be welcomed 🍻