title: React Native Maps FlatList scrollToIndex() not a function / undefined
body: <p>I'm working with React Native maps with an animated FlatList on top and when I press on a map marker, I want the list to scroll to that particular index.  But when I try to do that I get this error <code>_this.flatListRef.scrollToIndex is not a function. '_this.flatListRef.scrollToIndex' is undefined</code></p>
  
  <p>The basics of my code look like this...</p>
  
  <pre><code>const AnimatedFlatList = Animated.createAnimatedComponent(FlatList);
  
  export default Map extends component {
  
    scrollToCard = index =&gt; {
      this.flatListRef.scrollToIndex({index})
    }
  
    render() {
  
      const { allProperties } = this.props;
  
      &lt;MapView
         ref={map =&gt; this.map = map}
         style={styles.map}
         initialRegion={{
            latitude: 35.2271,
            longitude: -80.8431,
            latitudeDelta: 0.0922,
            longitudeDelta: 0.421
            }}
         &gt;
  
         {allProperties &amp;&amp; allProperties.map((property, index) =&gt; (
           &lt;Marker
             coordinate={property.coordinates}
             title={property.propertyName}
             pinColor={theme.COLOR_GREEN}
             key={property.id}
             onPress={() =&gt; this.scrollToCard(index)}
           /&gt;
         ))}
  
         &lt;/MapView&gt;
  
           {allProperties &amp;&amp;
              &lt;AnimatedFlatList
                 ref={ref =&gt; {this.flatListRef = ref }}
                 data={allProperties}
                 getItemLayout={(data, index) =&gt; (
                    {length: CARD_WITH_MARGIN, offset: CARD_WITH_MARGIN * index, index}
                 )}
                 initialNumToRender={2}
                 horizontal
                 scrollEventThrottle={1}
                 showsHorizontalScrollIndicator={false}
                 snapToInterval={CARD_WITH_MARGIN}
                 onScroll={Animated.event(
                    [
                       {
                          nativeEvent: {
                             contentOffset: {
                               x: this.animation
                             },
                          },
                        },
                    ],
                    { useNativeDriver: true }
                      )}
                 style={styles.scrollView}
                 contentContainerStyle={styles.scrollContainer}
                 renderItem={this._renderItem}
                 keyExtractor={item =&gt; item.id}
               /&gt;
           }
    }
  
  }
  </code></pre>
  
  <p>Mainly it seems like my ref of flatListRef is undefined for some reason. At least that's my theory but I can't tell why.</p>
  
  <p>Can anyone spot what I'm doing wrong here?</p>
  
  <p>If it helps, <code>allProperties</code> is data coming back from a graphql query.</p>