ReactJS Array.push function not working in setState
<p>I'm making a primitive quiz app with 3 questions so far, all true or false. In my <code>handleContinue</code> method there is a call to push the users input from a radio form into the <code>userAnswers</code> array. It works fine for the first run of <code>handleContinue</code>, after that it throws an error: <code>Uncaught TypeError: this.state.userAnswers.push is not a function(…)</code></p>

<pre><code>import React from "react"

export default class Questions extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      questionNumber: 1,
      userAnswers: [],
      value: ''
    }

    this.handleContinue = this.handleContinue.bind(this)
    this.handleChange = this.handleChange.bind(this)
  }

  //when Continue button is clicked
  handleContinue() {
    this.setState({
      //this push function throws error on 2nd go round
      userAnswers: this.state.userAnswers.push(this.state.value),
      questionNumber: this.state.questionNumber + 1
    //callback function for synchronicity
    }, () =&gt; {
      if (this.state.questionNumber &gt; 3) {
        this.props.changeHeader(this.state.userAnswers.toString())
        this.props.unMount()
      } else {
        this.props.changeHeader("Question " + this.state.questionNumber)
      }
    })
    console.log(this.state.userAnswers)
  }

  handleChange(event) {
    this.setState({
      value: event.target.value
    })
  }

  render() {
    const questions = [
      "Blargh?",
      "blah blah blah?",
      "how many dogs?"
    ]
    return (
      &lt;div class="container-fluid text-center"&gt;
        &lt;h1&gt;{questions[this.state.questionNumber - 1]}&lt;/h1&gt;
        &lt;div class="radio"&gt;
          &lt;label class="radio-inline"&gt;
            &lt;input type="radio" class="form-control" name="trueFalse" value="true" 
            onChange={this.handleChange}/&gt;True
          &lt;/label&gt;&lt;br/&gt;&lt;br/&gt;
          &lt;label class="radio-inline"&gt;
            &lt;input type="radio" class="form-control" name="trueFalse" value="false" 
            onChange={this.handleChange}/&gt;False
          &lt;/label&gt;
          &lt;hr/&gt;
          &lt;button type="button" class="btn btn-primary" 
          onClick={this.handleContinue}&gt;Continue&lt;/button&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    )
  }
}
</code></pre>