[ReactNative] Revert onItemRef removal

Libraries/CustomComponents/Navigator/Navigator.js

@@ -220,6 +220,11 @@ var Navigator = React.createClass({
      */
     onDidFocus: PropTypes.func,
 
+    /**
+     * Will be called with (ref, indexInStack, route) when the scene ref changes
+     */
+    onItemRef: PropTypes.func,
+
     /**
      * Optionally provide a navigation bar that persists across scene
      * transitions
@@ -313,6 +318,7 @@ var Navigator = React.createClass({
       onPanResponderMove: this._handlePanResponderMove,
       onPanResponderTerminate: this._handlePanResponderTerminate,
     });
+    this._itemRefs = {};
     this._interactionHandle = null;
     this._emitWillFocus(this.state.routeStack[this.state.presentedIndex]);
   },
@@ -1000,10 +1006,22 @@ var Navigator = React.createClass({
     return this.state.routeStack.slice();
   },
 
+  _handleItemRef: function(itemId, route, ref) {
+    this._itemRefs[itemId] = ref;
+    var itemIndex = this.state.idStack.indexOf(itemId);
+    if (itemIndex === -1) {
+      return;
+    }
+    this.props.onItemRef && this.props.onItemRef(ref, itemIndex, route);
+  },
+
   _cleanScenesPastIndex: function(index) {
     var newStackLength = index + 1;
     // Remove any unneeded rendered routes.
     if (newStackLength < this.state.routeStack.length) {
+      this.state.idStack.slice(newStackLength).map((removingId) => {
+        this._itemRefs[removingId] = null;
+      });
       this.setState({
         sceneConfigStack: this.state.sceneConfigStack.slice(0, newStackLength),
         idStack: this.state.idStack.slice(0, newStackLength),
@@ -1013,22 +1031,38 @@ var Navigator = React.createClass({
   },
 
   _renderScene: function(route, i) {
+    var child = this.props.renderScene(
+      route,
+      this
+    );
     var disabledSceneStyle = null;
     if (i !== this.state.presentedIndex) {
       disabledSceneStyle = styles.disabledScene;
     }
+    var originalRef = child.ref;
+    if (originalRef != null && typeof originalRef !== 'function') {
+      console.warn(
+        'String refs are not supported for navigator scenes. Use a callback ' +
+        'ref instead. Ignoring ref: ' + originalRef
+      );
+      originalRef = null;
+    }
     return (
       <View
-        key={'scene_' + i}
+        key={this.state.idStack[i]}
         ref={'scene_' + i}
         onStartShouldSetResponderCapture={() => {
           return (this.state.transitionFromIndex != null) || (this.state.transitionFromIndex != null);
         }}
         style={[styles.baseScene, this.props.sceneStyle, disabledSceneStyle]}>
-        {this.props.renderScene(
-          route,
-          this
-        )}
+        {React.cloneElement(child, {
+          ref: component => {
+            this._handleItemRef(this.state.idStack[i], route, component);
+            if (originalRef) {
+              originalRef(component);
+            }
+          }
+        })}
       </View>
     );
   },