patternjavascriptreactCritical

Insert HTML with React Variable Statements (JSX)

Submitted by: @import:stackoverflow-api·Mar 10, 2026·

Viewed 0 times

jsxhtmlvariableinsertreactwithstatements

Problem

I am building something with React where I need to insert HTML with React Variables in JSX. Is there a way to have a variable like so:

var thisIsMyCopy = 'copy copy copy strong copy';

and to insert it into react like so, and have it work?

render: function() {
    return (
        {thisIsMyCopy}
    );
}

and have it insert the HTML as expected? I haven't seen or heard anything about a react function that could do this inline, or a method of parsing things that would allow this to work.

Solution

You can use dangerouslySetInnerHTML, e.g.

render: function() {
    return (
        
    );
}

Code Snippets

render: function() {
    return (
        <div className="content" dangerouslySetInnerHTML={{__html: thisIsMyCopy}}></div>
    );
}

Context

Stack Overflow Q#23616226, score: 455

Revisions (0)

No revisions yet.