title: React Context : Get Data from API and call API whenever some events happens in React Component
body: <p>I am new to React Context.
  I need to call the API in react context to use its data throughout my react application. Also the same API needs to be called on some CRUD operation on various component of react application.</p>
  
  <p>For now I am storing API data in redux which I don't want to store.</p>
  
  <p>Here is what I have tried..</p>
  
  <p>context.js File</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>import React, { useState, createContext,useEffect } from 'react';
  import {getData} from './actionMethods';
  
  const NewContext = createContext();
  
  function newContextProvider(props) {
      useEffect(async () =&gt; {
           const {dataValue}  = await getData()
  
           console.log("Data " , dataValue)    
       }, [])
       
       return (
          &lt;NewContext.Provider
              value={{
                  state: {
                      
                  },
                  actions: {
                      
                  }
              }}
          &gt;
              {props.children}
          &lt;/NewContext.Provider&gt;
      );
  }
  
  
  const newContextConsumer = newContext.Consumer;
  
  export { newContextProvider, newContextConsumer, newGridContext };</code></pre>
  </div>
  </div>
  </p>
  
  <p>actionMethods.js</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>export function getData() {
      let config = getInstance('GET', `${prefix}/xyz/list`)
      return axios(config).then(res =&gt; res.data).catch(err =&gt; {
        console.log(err)
      })
    }</code></pre>
  </div>
  </div>
  </p>
  
  <p>when any CRUD operation performs , I need to call the API from the context.js file to get the data from API and store in the context.</p>
  
  <p>Any help would be great.</p>
  
  <p>Thank You.</p>