react-native – React本机嵌套ScrollView锁定

前端之家收集整理的这篇文章主要介绍了react-native – React本机嵌套ScrollView锁定前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图在React Native中嵌套ScrollViews;具有嵌套垂直卷轴的水平滚动。

以下是一个例子:

var Test = React.createClass({
    render: function() {
        return (
            <ScrollView
                style={{width:320,height:568}}
                horizontal={true}
                pagingEnabled={true}>

                {times(3,(i) => {
                    return (
                        <View style={{width:320,height:568}}>

                            <ScrollView>
                                {times(20,(j) => {
                                    return (
                                        <View style={{width:320,height:100,backgroundColor:randomColor()}}/>
                                    );
                                })}
                            </ScrollView>

                        </View>
                    );
                })}

            </ScrollView>
        );
    },});

AppRegistry.registerComponent('MyApp',() => Test);

外滚子工作无瑕疵,但当内触摸屏在移动时触碰时,内滚筒即可滑动。我的意思是:如果你滚动,提起你的手指,并再次触摸它,当它仍然移动与动量,它停止,根本没有反应触摸移动。要滚动更多,你必须提起你的手指,再次触摸。

这是非常可重复的,感觉就像与手势响应者有关。

有没有人看到这个问题?

我甚至会开始调试这个?有没有办法看到什么响应触摸,授予和释放,什么时候?

谢谢。

更新:

它看起来像是响应者系统,通过在内部和外部滚动条上放置onResponderMove侦听器:

<ScrollView 
    onResponderMove={()=>{console.log('outer responding');}}
    ...

    <ScrollView
        onResponderMove={()=>{console.log('inner responding');}}>
        ...

很显然,外部ScrollView正在抓住控制。我猜这个问题是,当试图垂直滚动时,如何阻止外卷轴控制?为什么只有当您尝试滚动已经移动的内部ScrollView时才会发生这种情况?

在内部的应答器中,尝试设置:
onPanResponderTerminationRequest: () => false
原文链接:https://www.f2er.com/react/301371.html

猜你在找的React相关文章