Multiple onScroll Events on ScrollView React Native?

Question

Is it possible to have multiple onScroll events in React Native's ScrollView?

The problem i'm having is that I have a component that renders a ListView like so:

<ListView
      onScroll={Animated.event(
        [{nativeEvent: {contentOffset: {y: this.state.scrollY}}}],
        {onScroll: this.props.onScroll}
      )}
      scrollEventThrottle={10}
      dataSource={stuff}
      removeClippedSubviews={false}
      renderSeparator={this.makeSeparator}
      renderRow={this.makeStuff}
      enableEmptySections={true}
    />

As you can see there's already an Animaion event subscribed to it, but I also want to be able to pass this.props.onScroll in case I want different scroll functionality for higher components that render this one.

Is this possible? Any ideas?

Answer 1

if you are using "useNativeDriver":

onScroll = Animated.event(
        [{nativeEvent: {contentOffset: {x: this.xOffset}}}],
        {
            listener: (event)=>{
                //do something here like Keyboard.dismiss() or this.props.onScroll(event)
            },
            useNativeDriver: true
        }
    );

Answer 2

If you're looking to combine events, I'd just take the Animated.event out into its own method. So

<ListView
      onScroll={this.onScroll.bind(this)}
      ...
      />

onScroll(event) {
    if(this.props.onScroll) this.props.onScroll(event)
    Animated.event(
        [{nativeEvent: {contentOffset: {y: this.state.scrollY}}}],
        {onScroll: this.props.onScroll}
    )(event)
}