CODEWITHSUNDEEP
reactjstypescript
Arximede
Arximede

Reputation: 391

Is it okay to store JSX.Element in useState?

Is it okay to do the following?

const Foo: FC = () => {
    [myState, setMyState] = useState<JSX.Element | null>(null)
    
    useEffect(() => {
        setMyState(<p>Hi</p>)
    }, [])

    return myState
}

I have tried this and it does work, however I can't find any resources on whether or not this is a good practice, or if this has any consequences in terms of performance or anything like that.

Upvotes: 1

Views: 6979

Answers (1)

Kouta Nakano
Kouta Nakano

Reputation: 643

I don't recommend it.

States should be data values. If you wanted certain components to render conditionally, refer to the state values(data) to decide the cases.

Upvotes: 4

Related Questions