How to show html entity using React?

javascript reactjs superscript

JoeTidee · May 22, 2017 · Viewed 28.2k times · Source

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

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

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

Another option is to use fromCharCode method:

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