Q:

React Native Component lifecycle methods not getting called in proper sequence

As per these links React Native Component Lifecycle and Component Lifecycle, the componentWillMount method should get called before render method, but this is not the case in my project. I'm doing a fetch operation inside componentWillMount, but while that is doing stuff, the render method gets called before componentWillMount finishes. Here's my class:
class UserHomeScreen extends Component {
 state = { userID: '' };
 componentWillMount(){
     AsyncStorage.getItem('userId').then((value) => {
         this.setState({ userID: value });
         const API_ENDPOINT= 'https://myserverAPI';
         const userID = value;
         fetch(API_ENDPOINT,{ method: "GET",
             headers:{
                 'Authorization': 'Bearer '+ userID
             }
         })
             .then((response) => response.json())
             .then((responseJson) => {
                 console.log(responseJson);
                 userInfo = new UserInfo();
                 userInfo.updateValues(responseJson);
                 AsyncStorage.setItem("userInfo",JSON.stringify(userInfo),null);
                 backInfo = AsyncStorage.getItem("userInfo").then(value);
             })

     });
 }

 render(){

     return(
         <Text>hello { this.state.userID }
         </Text>
     )
 }

}

A:

They are getting called in the right order of the lifecycle. Your issue is in fetch because the Fetch API returns a Promise which is not synchronous. You can either solve this by forcing a re-render if you set the state inside the promise e.g.
this.setState({mode = 'loading'})
API.fetch().then(this.setState({mode = 'finished'})); // pseudo code

or force wait for the Promise. I would go with option one and set a place holder in your render method e.g.
 render() {
        return (
            this.state.mode == "loading" ? <div>"Loading..." </div> :
            <div>{do your stuff with the fetched response}</div> 
    }

