title: How to merge two React hook outputs into one
body: <p>I have two hooks and I want the output of that hook should be compared to each other means in 1 hook there are maybe id 1 and id 2 which has some purchase value and in 2nd hook, there is an id that may contain both id 1 and 2 or contains only one which has different purchase value for maybe last year so I want to compare these two hooks and output of this hook I want to save it in 1 another hook so that I can show that output in table structure.</p>
  <p>**```useEffect(()=&gt;{
  Axios.get(<code>http://localhost:3001/inoutTo/report/date/${purchase_date}</code>).then((response)=&gt;{
  console.log(response.data)
  setlistOfDate(response.data)</p>
  <p>})})
  useEffect(()=&gt;{
  axios.get(<code>http://localhost:3001/inoutTo/report/date/stk/${purchase_date}</code>).then((response)=&gt;{
  console.log(response.data)
  setlastDateStk(response.data)<br />
  })})```**</p>
  <blockquote>
  <blockquote>
  </blockquote>
  </blockquote>
  <p>I want to compare this two output and shows the results in the Html Table structure
  I tried two options that I found in StackOverflow treads which is
  1.</p>
  <pre><code> Axios.get(`http://localhost:3001/inoutTo/report/date/${purchase_date}`)
   .then(res=&gt;{
     setlistOfDate(res.data)
     setIsLoading(false)
   })
   .catch(err=&gt;{
     console.log(err)
   });
   axios.get(`http://localhost:3001/inoutTo/report/date/stk/${purchase_date}`)
   .then(res=&gt;{
     setlastDateStk(res.data.results)
     setIsLoading(false)
   })
   .catch(err=&gt;{
     console.log(err)
   });
  },[]);
  useEffect(()=&gt;{
   setTest({...test,listOfDate,lastDateStk})
  },[listOfDate,lastDateStk])```**
  &gt;&gt;
  here error is coming that I cannot use parameter {purchase_date}
  and 
  
  2.
  
  
  **```useEffect(()=&gt;{
   setIsLoading(true);
   Promise.all([
     Axios.get(`http://localhost:3001/inoutTo/report/stk/${purchase_date}`),
     Axios.get(`http://localhost:3001/inoutTo/report/${purchase_date}`)
   ]).then((results)=&gt;{
    setIsLoading(false);
    setTest({
     listOfDate:results[0].data,
     lastDateStk:results[1].data.results
    });
   }).catch((err)=&gt;{
     setIsLoading(false)
     console.log(err)
   });
  },[])```**
  
  &gt;&gt;
  I don't know how can I do it.
  Please help I am stuck on this problem for the last 2 days, tried everything but I guess because of my lack of knowledge about hooks merging it's not working, I must be missing something 
  Thank you in advance 
  
  
  </code></pre>