ScrollView React Native 上的多个 onScroll 事件？答案

【问题标题】：Multiple onScroll Events on ScrollView React Native?ScrollView React Native 上的多个 onScroll 事件？
【发布时间】：2017-06-02 19:06:21
【问题描述】：

React Native 的 ScrollView 中是否可以有多个 onScroll 事件？

我遇到的问题是我有一个像这样呈现ListView 的组件：

<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}
    />

正如您所见，已经有一个 Animaion 事件订阅了它，但我也希望能够传递 this.props.onScroll，以防我想要渲染该事件的更高组件的不同滚动功能。

这可能吗？有什么想法吗？

【问题讨论】：

标签： android ios react-native

【解决方案1】：

如果您使用的是“useNativeDriver”：

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

【讨论】：

这对我有用，即使不使用“useNativeDriver”

【解决方案2】：

如果您想组合事件，我只需将Animated.event 带入它自己的方法中。所以

<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)
}

【讨论】：