正常使用react-native-viewpager但是报错,已经install了,自己试了引入的地方出了问题,一打开引入就报错,请问什么问题?
代码如下:
import React, { Component } from 'react';
import {
StyleSheet,
Text,
Button,
Image,
Dimensions,
View
} from 'react-native';
import ViewPager from 'react-native-viewpager';
var { height, width } = Dimensions.get('window');
const IMGS = [
require('../images/banner.jpg'),
require('../images/banner1.jpg'),
require('../images/banner2.jpg')
]
export default class HomePage extends Component {
constructor(props){
super(props);
let ds = new ViewPager.DataSource({
pageHasChanged: (p1, p2) => p1 !== p2
});
this.state = {
data:ds.cloneWithPages(IMGS)
}
}
_renderPage(page) {
return (<Image source={page} />)
}
render() {
return (
<View style = {{ position: 'relative' }} >
<View style = { styles.search } >
<Text > 搜索 </Text>
</View>
<View style = { styles.header } >
<ViewPager
dataSource={this.state.data}
renderPage={this._renderPage}
isLoop={true}
autoPlay={true} />
</View>
<View style = { styles.notice } >
<Text > 通知 </Text>
</View>
<View style = { styles.recommond } >
<Text > 推荐 </Text>
</View>
<View style = { styles.products } >
<Text > 产品 </Text>
</View>
<Button title = "Go to Home"
onPress = {
() => this.props.navigation.navigate('Product') }
/>
</View>
)
}
}
const styles = StyleSheet.create({
search: {
width: width,
position: 'absolute',
left: 0,
top: 20,
zIndex: 99,
height: 30,
backgroundColor: 'rgba(255, 255, 255, .5)'
},
header: {
backgroundColor: '#ff4400'
},
notice: {
height: 50,
backgroundColor: '#ff4400'
},
recommond: {
height: 80,
backgroundColor: '#ff4400'
},
products: {
backgroundColor: '#ff4400'
}
});
github 上这个项目已经废弃了,报错是这个项目引用的还是旧版本 React,新版本 React 已经不自带 PropTypes 了。试试这个react-native-swiper
如果觉得有帮助请支持我吧!