<ViewPagerAndroid
style={{flex: 1}}
initialPage={0}
peekEnabled={true}
ref={viewPager => {
this.viewPager = viewPager
}}
onPageSelected={(e) => this.bindOnPageSelected(e)}
>
<View style={styles.productsContainer}>
<Swiper
index={0}
loop={false}
renderPagination={renderPagination}
>
<Image style={styles.imgStyle} source={ImageStore.commonPic.defaultGood}/>
<Image style={styles.imgStyle} source={ImageStore.commonPic.defaultGood}/>
<Image style={styles.imgStyle} source={ImageStore.commonPic.defaultGood}/>
</Swiper>
</View>
<View style={styles.detailsContainer}>
...
</View>
</ViewPagerAndroid>
如果直接包裹Swiper組件渲染時圖片不會顯示：
解決辦法：添加定時器
constructor(props) {
super(props);
this.state = {
swiperShow: false
};
}
componentDidMount() {
setTimeout(() => {
this.setState({
swiperShow: true
});
}, 0)
}
render(){
return(
<View>
{this.state.swiperShow && <SwiperImage/>}
<View/>
)
}
