ios - 如何在 React Native 中从 ScrollView 组件获取 onPress 事件

Question

我是 React Native 的新手.我有一个带有 ScrollView 的应用程序组件和其中的几个自定义组件。我想从 ScrollView 触发一个 onPressOut 事件，这样当用户滚动和释放时，ScrollView 内的子组件会更新它们的状态。但是，ScrollView 文档不包含任何新闻事件:https://facebook.github.io/react-native/docs/scrollview.html

我尝试过的其他事情:

• 我尝试将 ScrollView 包装在 TouchableWithoutFeedback 中组件，当我这样做时，我在尝试滚动时立即收到错误消息:

2015-10-26 11:59:13.849 [error][tid:com.facebook.React.ShadowQueue][RCTModuleMethod.m:60] Argument 0 (NSNumber) of RCTUIManager.measure must not be null 2015-10-26 11:59:13.850 [error][tid:com.facebook.React.ShadowQueue][RCTModuleMethod.m:60] Argument 0 () of RCTUIManager.measure could not be processed. Aborting method call.

不知道是什么意思...有任何想法吗？谢谢!

这是我的代码:

<View ref="theWrapperView" style={styles.theWrapperView}>
            <ScrollView 
                onScroll={this.onScroll.bind(this)}
                onMomentumScrollEnd={this.onScrollAnimationEnd.bind(this)}

                style={styles.scrollView}
                contentContainerStyle={styles.scrollViewContentContainer}

                showsHorizontalScrollIndicator={true}
                scrollEventThrottle={10}
                pagingEnabled={true}
                horizontal={true}
                automaticallyAdjustContentInsets={false}
                snapToAlignment={'center'}
                snapToInterval={20}
                zoomScale={1.5}
                centerContent = {true}

            >
                {cards}
            </ScrollView>
        </View>

当我将 View 元素更改为 TouchableWithoutFeedback 元素时出现错误。

Answer 1

我在研究 React Native 源代码后发现了这一点:https://github.com/facebook/react-native/blob/master/Libraries/Components/ScrollResponder.js

事实证明，实际上有许多其他事件可通过 ScrollResponder mixin 获得，在线文档中未提及。没有必要包含 mixin 来访问这些事件，因为它们已经是 ScrollView 组件的一部分。对我有用的是 onResponderRelease，它会在您释放 ScrollView 时触发，如下所示:

<View ref="theWrapperView" style={styles.theWrapperView}>
            <ScrollView 
                onScroll={this.onScroll.bind(this)}
                onMomentumScrollEnd={this.onScrollAnimationEnd.bind(this)}
                onResponderRelease = {this.onResponderReleaseHandler.bind(this)}
            >
                {cards}
            </ScrollView>
        </View>

并在类中定义一个处理程序:

onResponderRelease(){
//do stuff

}