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 [错误] [TID：com.facebook.React.ShadowQueue] [RCTModuleMethod.m：60] RCTUIManager.measure的参数0（NSNumber）不能为空 2015-10-26 11：59：13.850 [错误] [tid：com.facebook.React.ShadowQueue] [RCTModuleMethod.m：60] 无法处理RCTUIManager.measure的参数0（）。中止方法调用。

不知道这意味着什么...... 有任何想法吗？谢谢！

这是我的代码：

<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

}

如何从React Native

1 个答案: