Question: How do I guarantee the data (async) is ready when the user clicks on an option of an actionSheetIOS?

Question

How do I guarantee the data (async) is ready when the user clicks on an option of an actionSheetIOS?

Answers 2
Added at 2016-05-19 01:05
Tags
Question

I am developing an IOS app using React Native and Reflux. When the user opens up a certain actionSheetIOS, I trigger an action which causes the store to make an async request. The store keeps the collection of all of instances of data returned and passes down all the data to all of the views that subscribe to that dataset. However, since one of the options of the actionSheet requires the data returned by that request, I can't guarantee that the data will be ready when the user click on the option. How do I guarantee the data (async) is ready when the user clicks on an option of an actionSheetIOS?

I hope I was able to explain this well enough. Also, I am relatively knew at React/Reflux so I may be missing something altogether.

Answers
nr: #1 dodano: 2016-05-19 13:05

Can you not trigger ActionSheetIOS until the data is ready? Something like this...

<TouchableOpacity
  onPress={() => {
           // call the async method first
           runSomeAsyncMethod()
           .then((data) => {
             // wait until the method finishes before triggering ActionSheetIOS
             ActionSheetIOS.showActionSheetWithOptions({
              options: BUTTONS,
              cancelButtonIndex: CANCEL_INDEX,
              destructiveButtonIndex: DESTRUCTIVE_INDEX,
              },
              (buttonIndex) => {
                this.setState({ clicked: BUTTONS[buttonIndex] });
              });
            }
          }}
>
  <Text>Click Me!</Text>
</TouchableOpacity>

This is assuming your method is a promise... but you should get the idea.

nr: #2 dodano: 2016-05-26 01:05

What I have found to work best (so far) is to return a Promise as if it were the data requested. The Promise will contain the async request and resolve with the data required.

The onPress handler would look as follows:

onPress = {()=>{
  returnedPromise.then((requestData)=>{
    //  do something with requestedData
  }).catch(()=>{
    //  oops.. time to handle the error
  })
}} 
Source Show
◀ Wstecz