react-native-viewpager使用报错

正常使用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

如果觉得有帮助请支持我吧!


猜你喜欢

转载自blog.csdn.net/u014307349/article/details/80197927
今日推荐