Below is a gist for stripped version of my code. I am trying to render a ExNavigator component where the initial route shows a list of alarms. I am using AysncStorage React Native API to store and load alarms. This is more of a prototype that I am creating to test out the features of ExNavigator and AsyncStorage before starting work on the actual app.

Gist

I am observing the following series of events in the console logs

1. render on Alarms called with an empty list of alarms (expected)
2. renderScene for the route called with empty list of alarms (expected)
3. render on Alarms called with the two alarms added to the AsyncStorage in the componentWillMount method (expected)
4. renderScene for the route called with empty list of alarms (NOT expected)

At step 4, I was expecting that the renderScene would be called with the two alarms read from the AsyncStorage. I ran the code in debugger. I see that the getHomeRoute method is called with correct list of alarms but when the renderScene called, it still received an empty list of alarms.

I am not sure why the renderScene is not called with the updated list of alarms. Please let me know if you have any pointers.

I wanted to create a sample app on RN play to show the symptoms but I wasn't sure how to include ex-navigator library in RN play

Below is the output from the console

// This is from the initial render
Rendering alarms with alarms  []
AlarmsRouter received following alarms  []
renderScene received following alarms  []

// This is from the render called after setting the alarms from AsyncStorage
Rendering alarms with alarms  [Object, Object]
AlarmsRouter received following alarms  [Object, Object]
renderScene received following alarms  []

I have also created a question on stackoverflow but didn't find any tags for exponentjs so added a issue here also.