title: React Native Loading data when button is pressed
body: <p>I am interested in getting my <code>QuestionList.js</code> component to load data when a button is pressed, however I do not want it to load all the data from the api, just one object per screen from this array of 10 objects.</p>
  
  <p>I believe I have an order of operations problem here that I need some help solving.</p>
  
  <p>I do know how to fetch data from an API using <code>axios</code> and <code>componentWIllMount()</code> which will fetch my data the moment the app boots up, but I am not sure if this is what I want to do since its a quiz application.</p>
  
  <p>So I only want this array of objects to be fetched when a user presses a button.</p>
  
  <p>Or am I thinking about this all wrong? Should I continue on with this configuration:</p>
  
  <pre><code>import React, { Component } from 'react';
  import { View, Text } from 'react-native';
  import axios from 'axios';
  
  class QuestionList extends Component {
    componentWillMount() {
      axios
        .get('https://opentdb.com/api.php?amount=10&amp;difficulty=hard&amp;type=boolean')
        .then(response =&gt; console.log(response));
    }
  
    render() {
      return (
        &lt;View&gt;
          &lt;Text&gt;Question List!!!&lt;/Text&gt;
        &lt;/View&gt;
      );
    }
  }
  
  export default QuestionList;
  </code></pre>
  
  <p>which is working and then have it load a second time when a user presses a button and then that's when it actually renders to the screen?</p>
  
  <p>Should I even be using the <code>componentWillMount()</code> lifecycle method if the user does not need the data until a button is pressed?</p>
  
  <p>Please help.</p>