Component is not rendering again React JS

Question

This is simple program of React JS when i update its running render method but not re-rendering Component again

this is how updating state

this.setState({q_no : this.state.q_no +1 });

Render Method

render(){
        const {loading, q_no, questions} = this.state;
        return(
            <div className="container cond7sdagF">
                <h3><i>{this.quizInd.name}</i></h3>
                {!loading && <h6>Loading</h6>}
                {loading && <Question question={questions[q_no]} nextQuestion={this.nextQuestion} />}
            </div>
        )
    }

Answer 1

Not sure if it is a typo or not but it seems that your conditions are backwards:

This

        {!loading && <h6>Loading</h6>}
        {loading && <Question question={questions[q_no]} nextQuestion={this.nextQuestion} />}

Should be like this

            {loading && <h6>Loading</h6>}
            {!loading && <Question question={questions[q_no]} nextQuestion={this.nextQuestion} />}

Another thing, when ever your new state is based on the previous state, its better to use the functional version of setState :

this.setState(state => ({q_no : state.q_no +1 }));