title: How can i update fetch request in reactjs
body: <p>I am fetching a quotes API. Here I want to update the quotes randomly but I want to update the quotes on button click. I have no idea how to do that. Can anyone help me to do so?</p>
  
  <p>I have fetched data using fetch request then add data to state.</p>
  
  <blockquote>
    <p>This is my code</p>
  </blockquote>
  
  <pre><code>import React from "react";    
  import "./styles.css";    
  class Box extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        quote: "",
        author: ""
      };
    }    
    componentDidMount() {
      this.fetchData();
    }
    fetchData = () =&gt; {
      fetch(
        "https://gist.githubusercontent.com/camperbot/5a022b72e96c4c9585c32bf6a75f62d9/raw/e3c6895ce42069f0ee7e991229064f167fe8ccdc/quotes.json"
      )
        .then(result =&gt; {
          return result.json();
        })
        .then(data =&gt; {
          const ran = Math.floor(Math.random() * data.quotes.length);       
          console.log(data.quotes[ran].quote);
          console.log(data.quotes[ran].author);
          this.setState({
            quote: data.quotes[ran].quote,
            author: data.quotes[ran].author
          });
        });
    };
  
    render() {
      return (
        &lt;div id="quote-box" className="container"&gt;
          &lt;div className="box-container"&gt;
            &lt;div className="text-center"&gt;
              &lt;h1 id="text"&gt;{this.state.quote}&lt;/h1&gt;
            &lt;/div&gt;
            &lt;div className="float-right"&gt;
              &lt;p id="author"&gt;
                &lt;span&gt;- &lt;/span&gt;
                {this.state.author}
              &lt;/p&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="box-item"&gt;
            &lt;div className="row"&gt;
              &lt;div className="col-sm-6"&gt;Twitter&lt;/div&gt;
              &lt;div className="col-sm-6"&gt;
                &lt;button&gt;next quote&lt;/button&gt;  &lt;--- Here i want this button to update quotes on screen.
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default Box;
  </code></pre>