title: I need a way to make the component render conditionally
body: <p>I'm still new to react and I'm making a decision tree and I got the buttons to render and make them move down to the next question but now I want it to jump to certain parts of the array depending on how they answer (true or false).</p>
  <p>for example, I want question[0] to jump to [6] as a response if they answer yes(true)</p>
  <p>i was thinking of trying to use if then statements, just not sure if my code makes that harder or easier to do.</p>
  <pre><code>  const questions = [
      {
        questionText: &quot;Is the account data entry?&quot;,
        answerOptions: [
          {answerText: &quot;No&quot;, isCorrect: false},
          {answerText: &quot;Yes&quot;, isCorrect: true},
        ],
      },
      {
        questionText: &quot;Is this customer 1 or 2?&quot;,
        answerOptions: [
          {answerText: &quot;No&quot;, isCorrect: false},
          {answerText: &quot;Yes&quot;, isCorrect: true},
        ],
      },
      {
        questionText: &quot;Is it someone with a Power of Attorney or Conservatorship for the Customer?&quot;,
        answerOptions: [
          {answerText: &quot;No&quot;, isCorrect: false},
          {answerText: &quot;Yes&quot;, isCorrect: true},
        ],
      },
      {
        questionText: &quot;Is it someone with a signed 'Name Add Form' on file?&quot;,
        answerOptions: [
          {answerText: &quot;No&quot;, isCorrect: false},
          {answerText: &quot;Yes&quot;, isCorrect: true},
        ],
      },
      {
        questionText: &quot;Is it someone who is verbally authorized by a verified account holder to speak?&quot;,
        answerOptions: [
          {answerText: &quot;No&quot;, isCorrect: false},
          {answerText: &quot;Yes&quot;, isCorrect: true},
        ],
      },
      { //this is object number 5
        questionText: &quot;VERIFIED&quot;,
        answerOptions: [
  
        ],
      },
      { //this is object number 6
        questionText: &quot;You can tell the customer their verbal password.&quot;,
        answerOptions: [
  
        ],
      },
    ]
  
    const [currentQuestion, setCurrentQuestion] = useState(0);
  
    const handleAnswerButton = () =&gt; {
      const nextQuestion = currentQuestion + 1;
      setCurrentQuestion(nextQuestion);
    }
  
    return (  
      &lt;div className=&quot;App&quot;&gt;
        &lt;h1&gt;{questions[currentQuestion].questionText}&lt;/h1&gt;
        
        &lt;div className=&quot;answerSection&quot;&gt;
          {questions[currentQuestion].answerOptions.map((answerOption)=&gt; (
          &lt;button onClick={handleAnswerButton}&gt;{answerOption.answerText}&lt;/button&gt;
          ))}
        &lt;/div&gt;
      &lt;/div&gt;
    );
  }
  </code></pre>