React native中TouchableOpacity下FlatList不能滚动问题

最近因为项目需要,又折腾起React native。RN理念很好,坑也很多。这几天就遇到了使用model封装弹框时,里面的FlatList不能滚动问题。其中的主要的两个方法如下

render() {
        return (
            
                 {alert("Modal has been closed.")}}
                >
                    {
                            this.setModalVisible(false)
                        }}
                        activeOpacity={1}
                    >
                        {

                            }}
                        >
                            {
                            console.log('scroll');
                            }}
                            style={{padding:5}}
                            renderItem={(data)=>this._renderItem(data)}
                            keyExtractor = {this._extraUniqueKey}// 每个item的key
                            />
                        
                    
                
            
        );
    }
    _renderItem(data){
        return (
            {
                    this.clickItem(data)
                }}
            >
                
                    
                        {data.item}
                    
                
            
        );


    }
    _extraUniqueKey(item ,index){
        return "index"+index+item;
    }

效果如下。但Flatlist无法滚动

React native中TouchableOpacity下FlatList不能滚动问题_第1张图片

谷歌后发现一解决办法就是将renderItem中的父容器由View改成TouchOpacity(Touch系列组件应该都可以),然后就正常滚动了。原因未知,应该是RN的一个BUG。



你可能感兴趣的:(React,Native)