react-native-viewpager踩坑记

react-native-viewpager是一个轮播图组件，最近有一个需求是有一个测试题页面，我第一反应是用一个轮播图组件，只是把轮播图替换成轮播视图，每个视图里面内容比图片复杂一些而已。。。然而，我只是这么想想，实际做起来还不知道会遇到什么坑，开始踩坑吧。

npm install react-native-viewpager --save

一开始就遇到一个比较坑的问题，我直接谷歌搜索react-native-viewpager 出来的第一个一看是github上面的，点进去也叫这个名字，没毛病啊，跟着教程安装，输入安装命令：npm install rn-viewpager --save，然后我挺纳闷，为啥安装名字变了，回到谷歌搜索往下翻了几个，好像都是这个组件，比较尴尬的是我安装一直失败，导致我照着教程写代码一直报错，无奈我直接在github 上搜索，结果出现在第一个的居然不是我之前搜出来的这个，搞了半天我连组件都安装错了，react-native-viewpager 这是正确的github地址。

接着看教程，太简短了。。简短到我怀疑人生，

var ViewPager = require('react-native-viewpager');
<ViewPager
    dataSource={
  this.state.dataSource}
    renderPage={
  this._renderPage}/>

现在这个时代谁还用es5，先把引入方式改一下：
import ViewPager from 'react-native-viewpager';
接着看，看这个结构是不是跟ListView组件一样一样的？先暂时不管配置参数，我的第一目标是先让视图轮播起来，这里也没写dataSource应该怎么定义，renderPage应该怎么渲染，我理所当然的认为跟listview是一样的，于是我的代码是这样写的：

    const ds = new ListView.DataSource({
      rowHasChanged: (r1,r2) => r1 !== r2
    });
    this.state = {
      dataSou