score:0

class Main extends Component{

    state = {
        //change
        activeQ: 0,
        quesArr: [],
        ansArr: []
    }


    componentDidMount(){
        fetch('http://localhost:3500/questions')
        .then(quesArr => quesArr.json())
        .then(newQuesArr => {
            this.setState({
                quesArr: [...newQuesArr]
            })
        })
    fetch('http://localhost:3500/answers')
        .then(answerArr => answerArr.json())
        .then(newAnsArr =>{
            this.setState({
                ansArr: newAnsArr
            })
        })
    }

    //change
    updateActiveQuestion = () => this.setState((prevState) => {activeQ: prevState.activeQ + 1})



    render(){
        let questions = this.state.quesArr
        const renderQues = () => (
        questions.map((question, index) => <Question questionObj={question} key= {index}/>)
    )


    return (
        <div>
            Questions go here:

            //change
            <Question questionObj={questions[this.state.activeQ]}/>
            <button onClick={() => this.updateActiveQuestion()}>Next Question</button>
            Answers go here:

        </div>
        )
    }
}

Related Query

More Query from same tag