Render JSON content in React component

[admin]

Trying to display the render content from the

wordpress

API

      "rendered":"<p>Star Wars: Episode IV - A New Hope […]<\/p>\n" },

I'm using

superagent

to make the request

getPost(){

    var self = this;
request.get(WP_URL + '/posts?filter[paged]=1&filter[posts_per_page]=1').end(function(err, res) {
    self.setPost(res);
});
}

Setting the state in a callback and

setPost(res){
this.setState({
    text: res.body[0].content.rendered
});

}

rawMarkup() {
return { __html: this.state.text };
    }

When I try and render the markup like this:

render() {
    return (
        <div>
            <Header />
            <MainNavigation />
            <AboutPage />
            <SkillsSection />
            <ExperienceSection />
            <div className="container">
                <div className="row">
                    <div className="col-sm-8 blog-main">
                    {this.rawMarkup()}
                    </div>
                </div>
            </div>
            <Footer />
        </div>
    );
}
}

I get the error:

Uncaught Invariant Violation: Objects are not valid as a React child (found: object with keys {__html}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.

How can I render the json in my component?