CODEWITHSUNDEEP
reactjs
aneuroo
aneuroo

Reputation: 85

Set React state from JSON to display HTML elements

I have created a simple login form, when I login the api responses the correct data to the data I have send from the form, so if I login correct/incorrect details the response I get is right, however in the message span the response is HTML and is just been displayed as text. How can I get it to display as HTML rather than plain-text as displayed in the image.

enter image description here

        if(body.length > 0 )
        {
            //console.log(myAccountDetails);
            if(body === Array){
                this.setState({message:<span className="text-success">Logged In</span>, })
            }
            else
            {
                this.setState({message:<span className="text-danger">{body}</span>, })
            }
           

        }

Upvotes: 1

Views: 38

Answers (1)

Amila Senadheera
Amila Senadheera

Reputation: 13265

You should use dangerouslySetInnerHTML property to do that.

this.setState({
  message: (
    <span dangerouslySetInnerHTML ={{ __html: body }} className="text-danger" />
  )
});

Upvotes: 1

Related Questions