How to show html entity using React?

Question

I am wanting to show the 'cubic' html entity (superscript 3). I am doing like this:

const formatArea = function(val){     return val + " ft³"; } 

where formatArea is being called from inside the component':

render(){     return (         <div>             {formatArea(this.props.area)}         </div>     ); } 

but, the browser is showing it as ft³

Answer 1

Another option is to use fromCharCode method:

const formatArea = (val) => {     return val + ' ft' + String.fromCharCode(179); } 

Answer 2

New way using React's fragments:

<>&sup3;</> 

In your case it can be:

const formatArea = function(val){     return <>{val + ' '}&sup3;</> }