关于react-swipeable-views滑动切换页面的问题

Question

要做页面滑动到底部切换到下一页的效果，并且某些页面的内容超出一屏时内部也可以滚动。刚开始用swiper很难实现，后来发现了一个react-swipeable-views的Axis组件可以实现。但使用时发现问题不少。刚开始那些内部可以滚动的滚到底部后就滑不动了，切不到下一页，手机上和pc上都不行。后来不知道怎么弄的手机上可以了，但pc上还是不行，偶尔还报错：

手机上不报错，但有一个问题是必须在屏幕最底部往上滑才能切到下一页，如果在中间就滑不动，不知道是问什么，求大神帮忙研究一下。

主要代码如下：

<SwipeableViews
    containerStyle={styles.slideContainer}
    index={this.state.position}
    onChangeIndex={this.onChangeIndex}
    axis="y" resistance>
    {this.renderAll()}
</SwipeableViews>
                    
renderAll(){
    if(this.state.lecData&&this.state.lecData.page.constructor==Array){
        return this.state.lecData.page.map((x,index)=>{
            x.TT_ID = this.state.lecData.TT_ID;
            let isLast=(index==this.state.lecData.page.length-1);
            switch(x.kind){
                case 'cover':
                    return <div key={index} style={styles.scroll}>{this.renderCover(x,isLast)}</div>;
                case 'kpt':
                    return <div key={index} style={styles.scroll}>{this.renderKpt(x,isLast)}</div>;
                case 'example':
                case 'ques':
                    return <div key={index} style={styles.scroll}><Example data={x} isLast={isLast}/></div>;
                case 'video':
                    return <div key={index} style={styles.scroll}>{this.renderVideo(x,isLast)}</div>;
            }
        });
    }
}
        
const styles={
    slideContainer:{
        height:document.body.clientHeight,
        zoom:gVar.zoom
    },
    scroll:{
        height:document.body.clientHeight,
        overflow:'scroll'
    }
}

迫切要解决的是只能在底部才能滑动，在中间不能滑动的问题