react-native使用react-native-swiper不显示问题

问题

在使用 swiper 的时候,发现在安卓机下,如果用到了可滚动组件(如:FlatList , SectionList,ListView,ScrollView 等),swiper无法正常显示。

解决方法

加个只调用一次的定时器

constructor(props) {
    super(props);
    this.state = {
        swiperShow:false,
    };
}

componentDidMount(){
//系统自带方法只调用一次
    setTimeout(()=>{
       this.setTimeout = this.setState({swiperShow:true});
    },1)
}
//移除定时器
 componentWillUnmount(){
    this.setTimeout && clearTimeout(this.setTimeout);
}
renderSwiper=()=>{
    if(this.state.swiperShow){
        return (
            <Swiper height={150} autoplay={true} activeDotColor="#fff">
                {BANNER_LIST.map((item, i) => {
                    return <Image source={require('../../../img/banner.jpeg')}   key={i} style={styles.banner}/>;
                })}
            </Swiper>
        );
    }else {
        return <View style={{height:150}}></View>;
    }
}


然后在render()里面需要渲染 swiper 的地方调用 {this.renderSwiper()}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容