title: How to implement onClick componentDidMount() in React using Axios
body: <p>I am trying to make a movie search function using React, Axios, and movieDB API. The functionality I am trying to implement right now is typing in a movie into the search bar and clicking the submit button will return the movie title as an H1 element.</p>
  
  <p>My onClick function does not work: <code>&lt;button onClick={(e)=&gt;clickHandler()}&gt;submit&lt;/button&gt;</code></p>
  
  <p>componentDidMount() will work only when the page refreshes and you cannot search for anything as the submit button is broken.</p>
  
  <p>I am not sure how to implement this, but I would also not mind if I could get it to search by hitting enter instead of using a button, whichever is easier.</p>
  
  <p>Here is my code so far.</p>
  
  <p>App.js</p>
  
  <pre><code>import React from "react"
  import Movielist from './components/Movielist'
  
  
  
  function App() {
      return (
          &lt;div&gt;
              &lt;input type="search" id="search" /&gt;
              &lt;button onClick={(e)=&gt;clickHandler()}&gt;submit&lt;/button&gt;
              &lt;h1 id="title"&gt;title&lt;/h1&gt;
              &lt;Movielist /&gt;
          &lt;/div&gt;
  
      )
  }
  
  export default App
  
  </code></pre>
  
  <p>Movielist.js</p>
  
  <pre><code>import React from 'react';
  
  import axios from 'axios';
  
  export default class Movielist extends React.Component {
    state = {
      title: ""
    }
  
      componentDidMount() {
      const API_KEY = '***********************';
      const query = document.getElementById('search').value;
      axios.get(`https://api.themoviedb.org/3/search/movie?api_key=${API_KEY}&amp;query=${query}`)
        .then(res =&gt; {
          const title = res.data['results'][0]['title'];
          this.setState({ title });
  
        })
  
    }
  
    render() {
      return (
  
      &lt;h1&gt;{this.state.title}&lt;/h1&gt;
  
      )
    }
  }
  </code></pre>
  
  <p>index.js</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import App from './App';
  
  ReactDOM.render(
      &lt;App /&gt;,
      document.getElementById('root')
  );
  </code></pre>