title: react useEffect comparing objects
body: <p>I am using react <code>useEffect</code> hooks and checking if an object has changed and only then run the hook again.</p>
  
  <p>My code looks like this.</p>
  
  <pre><code>const useExample = (apiOptions) =&gt; {
      const [data, updateData] = useState([]);
      useEffect(() =&gt; {
         const [data, updateData] = useState&lt;any&gt;([]);
          doSomethingCool(apiOptions).then(res =&gt; {               
             updateData(response.data);
         })
      }, [apiOptions]);
  
      return {
          data
      };
  };
  </code></pre>
  
  <p>Unfortunately it keeps running as the objects are not being recognised as being the same.</p>
  
  <p>I believe the following is an example of why.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const objA = {
     method: 'GET'
  }
  
  const objB = {
     method: 'GET'
  }
  
  console.log(objA === objB)</code></pre>
  </div>
  </div>
  </p>
  
  <p>Perhaps running <code>JSON.stringify(apiOptions)</code> works?</p>