CODEWITHSUNDEEP
javascriptreactjs
Dev5
Dev5

Reputation: 459

React How to store HTML tags as a Javascript Object

I want to know how to store an html tag as a Javascript object. Consider the following code:

const temp = () => {
    const complexity = "O(n<sup>2</sup>)"
    return (
        <div>
            {complexity}
        </div>
    )
}

Right now, it renders as the exact string: O(n<sup>2</sup>)
Instead I want the <sup> to be treated as a the html tag and render as: O(n2)

Any help is appreciated. Thanks

Upvotes: 0

Views: 1089

Answers (3)

Erikm
Erikm

Reputation: 69

I would recommend you to wrap them with empty fragments instead. E.g.

const complexity = <>O(n<sup>2</sup>)</>

Upvotes: 0

Arun surendharan
Arun surendharan

Reputation: 61

This is not working because its not HTML its jsx. jsx must retun a single element..so just wrap your <sup> tag inside any other tag

const Test = () => {
const complexity = <span>O(n<sup>2</sup>)</span>
return (
    <div>
        {complexity}
    </div>
)

}

Upvotes: 1

Quentin
Quentin

Reputation: 943561

Don't use a string in the first place, use JSX:

const complexity = <React.Fragment>O(n<sup>2</sup>)</React.Fragment>

The React.Fragment is only needed here because you have three top-level nodes (text, element, text).

Upvotes: 2

Related Questions