美文网首页React Nativereact-native
react-native ScrollView 嵌套 FlatL

react-native ScrollView 嵌套 FlatL

作者: _若无 | 来源:发表于2020-09-29 10:38 被阅读0次

    最近项目遇到需要使用ScrollView 嵌套 FlatList的功能,当flatList滚动时,ScrollView也在滚动,最后在github上找到了解决办法,防止忘记记录一下!!
    ScrollView 嵌套 FlatList滚动,当flatList滚动时,ScrollView禁止滚动

    this.state = {
      enableScrollViewScroll: true,
      ...
    }
    onEnableScroll = value => {
        this.setState({
          enableScrollViewScroll: value,
        });
    };
    
    render() {
      return(
         <ScrollView 
           scrollEnabled={this.state.enableScrollViewScroll}
          >
            <FlatList 
                onTouchStart={() => {this.onEnableScroll(false);}}
                onMomentumScrollEnd={() => {this.onEnableScroll(true);}}
                ...
            />
            ...  
         </ScrollView>
      ) 
    }
    

    借鉴地址:https://github.com/facebook/react-native/issues/19971

    相关文章

      网友评论

        本文标题:react-native ScrollView 嵌套 FlatL

        本文链接:https://www.haomeiwen.com/subject/saosuktx.html