React-native component's componentDidMount() is not called under NavigatorIOS

Question

I create a component with ListView under the structure: TabBarIOS > NavigatorIOS > ListView. I try to fetch data in componentDidMount(). But it didn't work unless I fetch it in componentWillMount(). Why?

I've put my work here https://github.com/chiakie/MyAwesomeProject
In MotorcycleList.js, componentDidMount() seem to never be called.

Answer 1

The componentWillMount() life cycle event is actually the correct place to call fetchData() because it is invoked once before the component mounts, this way you can setState do that the data is there when it mounts.

Mounting: componentWillMount

void componentWillMount()

Invoked once, both on the client and server, immediately before the initial rendering occurs. If you call setState within this method,render() will see the updated state and will be executed only once despite the state change.

Whereas componentDidMount() renders after the component had already mounted.

Mounting: componentDidMount

void componentDidMount()

Invoked once, only on the client (not on the server), immediately after the initial rendering occurs. At this point in the lifecycle, you can access any refs to your children (e.g., to access the underlying DOM representation). The componentDidMount() method of child components is invoked before that of parent components.