title: React - how to stop useEffect from being called continuously without altering dropdown
body: <p>I am working on a project and I am having problems with the <code>useEffect</code> hook and a dropdown. Earlier I asked a question where I was suggested to remove the second argument from <code>useEffect</code> (<a href="https://stackoverflow.com/questions/62338536/react-empty-dropdown">React - Empty Dropdown</a>), but by doing that, <code>useEffect</code> loads constantly, i.e. it makes the same request to the server without stopping.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>    import axios from 'axios';
      import { Dropdown } from 'semantic-ui-react';
  
      type formProps = {
          funcionCierre: any
          carrera: any;
          nombre1: any;
      }
  
      const Estudiantes: React.FC&lt;formProps&gt; = (props: formProps) =&gt; {
  
          const [area, setArea] = useState&lt;any[]&gt;([]);
          const [conocimiento, setConocimiento] = useState&lt;any[]&gt;([]);
          const [areaSeleccionada, setAreaSeleccionada] = useState(0);
  
          useEffect(() =&gt; {//this is the request that it makes without stopping
              axios.get('http://localhost:8003/skill?carrera_id=' + props.carrera + '&amp;tipo_id=1')    
                  .then(result =&gt; {
                      console.log(result);                    
                      setArea(result.data);
                  }
  
                  ).catch(error =&gt; {
                      console.log(error);
                  });
  
          });
  
          const actualizarAreaSelect = (e: any) =&gt; {
              setAreaSeleccionada(e.target.value)
          }
  
          return (
                                      &lt;Dropdown
                                          placeholder='Area'
                                          options={area.map(ar =&gt; ({
                                              key: ar.skil_id,
                                              value: ar.skill_id,
                                              text: ar.nombre
                                          }))}
                                          onChange={actualizarAreaSelect}
                                      /&gt;
  
          );
      }
  </code></pre>
  
  <p>I need to know how to stop it (because that affects the server) without altering the dropdown.
  Thanks in advance for your help.</p>