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.

Methods:

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

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

Elements:

                    <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>
                        </div>
                    </div>

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.