React: why can't I update classes

So I was trying to use this 3 titles as tabs, changing the color of the selected one, however the state is changing correctly but the color is not changing because the classes are also not changing.Tabs


Debug output


    setTabClass(tab) {
        if (tab === this.graphTab) {
            return 'currentTab';
        else {
            return '';

    handleClassClick = (tab) => {
        this.setState( {graphTab: tab} );


                    <div className='chart-area'>
                        <div className='chart-area-tabs'>
                            <p className={this.setTabClass('sales')} onClick={() => this.handleClassClick('sales')} >Sales (0$)</p>
                            <p className={this.setTabClass('order')} onClick={() => this.handleClassClick('order')} >Order Volume (0)</p>
                            <p className={this.setTabClass('ticket')}  >Ticket Size ($0.00)</p>

Can someone help me with this?

>Solution :

You’re reading the graphTab state wrong – it should be this.state.graphTab instead of this.graphTab in the setTabClass method.

Leave a Reply