How to use the anchor option for iPad in React Native's ActionSheetIOS?

Question

As per the React Native documentation provided on https://facebook.github.io/react-native/docs/actionsheetios, we must pass a number to the anchor option. I honestly haven't read a more vague sentence in the whole docs and I am completely lost.

anchor (number) - the node to which the action sheet should be anchored (used for iPad)

I tried playing around with a bunch of numbers but the result is always the same. The ActionSheet opens to the top left of the screen.

From what I have been able to understand so far, the following should work:

ActionSheetIOS.showActionSheetWithOptions(
      {
        cancelButtonIndex: buttonsArray.length - 1,
        options: buttonsArray,
        anchor: 51, // THIS. WHAT THE HELL IS THIS NUMBER SUPPOSED TO BE?
      },
      (buttonIndex) => {
       .
       .
       .
      }
);

Answer 1

Erm so after digging around for exactly 13 minutes more after I posted the question above, I was able to find the answer.

React Native provides a function called findNodeHandle(). Pass the ref of the component you want to anchor the ActionSheet with.

Let's see how it is used.

import { findNodeHandle } from 'react-native'

.
.
.

ActionSheetIOS.showActionSheetWithOptions(
      {
        ...
        anchor: findNodeHandle(this.someFancyButtonRef)
      },
      (buttonIndex) => {
       ...
      }
);
.
.
.
render() {
    return (
        .
        .
        .
        <TouchableOpacity
            ref={(ref) => { this.someFancyButtonRef = ref; }}
        >
          <Text>Some Fancy Button</Text>
        </TouchableOpacity>
        .
        .
        .
    )
}