最近在rn项目中做了一个图片轮播的功能,ios展示正常,在Android机型上不显示,解决如下:
import React from 'react';
import { Text, View, Dimensions, Platform, ScrollView, Image } from 'react-native';
import Swiper from 'react-native-swiper';
export class ImgSwiper extends Component {
constructor(props) {
super(props);
}
renderSwiper = (index, list, screenWidth, height) => {
return (
<View style={{ // 这里的View很重要
width: 300, // 宽高根据需求获取
height: 300
}}>
<Swiper
showsButtons={false}
loop={false}
index={index}
removeClippedSubviews={false}
>
{
list.map((imgList, i) => {
return (
<View style={styles.slide1} key={i}>
<Image source={{ uri: imgList }} style={{
width: 300,
height: 300,
resizeMode: "cover"
}}></Image>
</View>
})
}
</Swiper>
</View>
)}
render() {
return (
<View >
{this.renderSwiper(index, list, screenWidth, height)}
</View>
)
}
}
在Swiper 组件外层包一层View 可解决Android显示问题