I'm creating a React app that fetches all its content by making requests to an API server. After doing some research I've discovered that, in the case that the JSON response sent by the API includes HTML entities or tags, I can use dangerouslySetInnerHTML to format the response, doing something like this:
class SinglePage extends React.Component {
render() {
const post = this.props.selectedPost
return(
<div id="page" className="single-page layout sb-content-sb">
<main id="content" className="column has-padding-top">
<article id="article">
<h1>{ post.data.title.rendered }</h1>
<div className="editor" dangerouslySetInnerHTML={ { __html: post.data.content.rendered } } />
</article>
</main>
</div>
);
}
}
This works, but it feels so weird... Is there a better way to do it?
