title: Using axios doesn't rerender my React Native component
body: <p>I am using hooks in React Native. This is my code:</p>
  
  <pre><code>
  
  useEffect(() =&gt; {
  
      if (var1.length &gt; 0 ){
  
  
        let sym = [];
        var1.map((items) =&gt; {
          let count = 0;
          state.map((stateItems) =&gt; {
  
            if(items === stateItems.name) {
              count = count + 1;
            }
  
          })
  
          if (count === 0) {
            sym.push(items)
          }
        });
  
  
  
        async function getAllStates (sym) {
          let stateValues = [];
          await Promise.all(sym.map(obj =&gt;
            axios.get(ServerURL + "/note?name=" + obj).then(response =&gt; {
              stateValues.push(response.data[0]);
            })
          )).then(() =&gt;{
            setNewItem(stateValues);
          });
  
        }
  
  
        getAllStates (sym);
  
      }
      }, [var1]);
  
  useEffect(() =&gt; {
        let stateValues = state;
        for( let count = 0 ; count &lt; newItem.length; count++ ){
          stateValues.push(newItem[count]);
        }
  
        setState(stateValues);
  
      }, [newItem]);
  
  </code></pre>
  
  <p>This runs successfully without any errors. However, when the state is displayed as below, I am not seeing the latest value added in the state. It shows all the previous values. When I refresh the whole application, I am able to see my value added. </p>
  
  <pre><code> return (
      &lt;View style={styles.container}&gt;
  
      &lt;Text  style = {{color:"white"}}&gt;
          {
            state.map( (item, key) =&gt;{
              return(
                &lt;Text key = {key} style = {{color:"white"}}&gt; {item.name} &lt;/Text&gt;
              )
            })
          }
      &lt;/Text&gt;
      &lt;/View&gt;
    );
  </code></pre>
  
  <p>Can someone tell me why this is happening? I want to see the data render immediately after the axios call. I am using React Native.</p>