title: React Native fetch won't work with redux?
body: <p>I am trying to make a simple fetch call, to a backend that I wrote myself in NodeJS. Although, I am having a hard time getting the fetch to work. I am using Redux Thunk together with Redux in React Native to sort out states and props, in order to make a self navigating login / register view. My actions look something like this:</p>
  
  <p><strong>actions.js</strong></p>
  
  <pre><code>import {
      LOGIN,
      LOGIN_SUCCESS,
      LOGIN_FAILED
  } from '../constants/constants'
  
  export function loginAPI() {
      return (dispatch) =&gt; {
        dispatch(userLogin())
        fetch('http://localhost:3000/users/')
        .then(data =&gt; data.json())
        .then(json =&gt; {
          console.log('json:', json)
          dispatch(userLoginSuccess(json.success))
        })
        .catch(err =&gt; dispatch(userLoginFailed(err)))
      }
    }
  
  function userLogin() {
      return {
          type: LOGIN,
      }
  }
  
  function userLoginSuccess(token) {
      return {
          type: LOGIN_SUCCESS,
          token,
      }
  }
  
  function userLoginFailed() {
      return {
          type: LOGIN_FAILED,
      }
  }
  </code></pre>
  
  <p><strong>user.js (<em>reducer</em>)</strong></p>
  
  <pre><code>import {
      LOGIN,
      LOGIN_SUCCESS,
      LOGIN_FAILED,
      } from '../constants/constants'
  
  const initialState = {
      token: "",
      isFetching: false,
      error: false
  }
  
  export default function reducers(state = initialState, action){
      switch (action.type) {
          case LOGIN:
            return {
              ...state,
              isFetching: true,
              token: ""
            }
          case LOGIN_SUCCESS:
            return {
              ...state,
              isFetching: false,
              token: action.token
            }
          case LOGIN_FAILED:
            return {
              ...state,
              isFetching: false,
              error: true
            }
          default:
            return state
        }
  }
  </code></pre>
  
  <p>and finally, this is my rendering page.</p>
  
  <p><strong>Login.js</strong></p>
  
  <pre><code>import React from 'react'
  import { TouchableHighlight, View, Text, StyleSheet } from 'react-native'
  
  import { connect } from 'react-redux'
  import { loginAPI } from '../actions/actions'
  
  let styles
  
  const Login = (props) =&gt; {
    const {
      container,
      text,
      button,
      buttonText
    } = styles
  
    const { token, isFetching } = props.user;
    console.log('Token: ', props.token);
  
    return (
      &lt;View style={container}&gt;
        &lt;Text style={text}&gt;Redux Example&lt;/Text&gt;
        &lt;TouchableHighlight style={button} onPress={() =&gt; props.loginAPI()}&gt;
          &lt;Text style={buttonText}&gt;Login&lt;/Text&gt;
        &lt;/TouchableHighlight&gt;
        {
          isFetching &amp;&amp; &lt;Text&gt;Loading&lt;/Text&gt;
        }
        {
          token ? (&lt;Text&gt;Name: {token}&lt;/Text&gt;) : null
        }
      &lt;/View&gt;
    )
  }
  
  styles = StyleSheet.create({
    container: {
      marginTop: 100,
      paddingLeft: 20,
      paddingRight: 20
    },
    text: {
      textAlign: 'center'
    },
    button: {
      height: 60,
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#0b7eff'
    },
    buttonText: {
      color: 'white'
    }
  })
  
  function mapStateToProps (state) {
    return {
      user: state.user
    }
  }
  
  function mapDispatchToProps (dispatch) {
    return {
      loginAPI: () =&gt; dispatch(loginAPI())
    }
  }
  
  export default connect(
    mapStateToProps,
    mapDispatchToProps
  )(Login)
  </code></pre>
  
  <p>issue here is that the fetch call never seems to make it to the backend. I have a log going on the backend to tell when a call is made to the API, and it never shows up. Debugging, checking the state shows that success (token) is null, which is understandable since the call is never made. The route to users returns a JSON object which contains a value "success", which is true. How come my loginAPI isn't fetching?</p>
  
  <p>And lastly this is my configStore</p>
  
  <p><strong>configStore.js</strong></p>
  
  <pre><code>import { createStore, applyMiddleware } from 'redux'
  import app from '../reducers'
  import thunk from 'redux-thunk'
  
  export default function configureStore() {
    let store = createStore(app, applyMiddleware(thunk))
    return store
  }
  </code></pre>