React native 在reactnative中设置autoscroll viewpager

我正在尝试制作滑动图像。我一直在关注这个问题。它的反应是用手指滑动，但不是自动滑动。我怎样才能做到？我已实施以下措施：

<ViewPager style={styles.viewPager} initialPage={0}>
                <View key="1">
                    <Image  style={ {height: '100%', width:'100%'}}source={{uri :'https://images.unsplash.com/photo-1441742917377-57f78ee0e582?h=1024'}}></Image>
                </View>
                <View key="2">
                <Image  style={ {height: '100%', width:'100%'}}source={{uri :'https://images.unsplash.com/photo-1441716844725-09cedc13a4e7?h=1024'}}></Image>
                </View>
</ViewPager>

---

通过查看源代码，我发现有一个方法

setPage（）

接受页码作为参数

查看他们提供的示例代码，您可以在其中找到如何使用reference和调用

setPage

方法

现在您可以使用

setInterval（）

并使自动滑动工作

setInterval(() => {
  this.viewPager.current.setPage(page);
}, 1000);

---

设置页面是一种更新viewpager页面的方法。您可以使用计时器和使用setPage方法更新寻呼机来自动滚动viewpager。下面是相同的完整代码

import React, { Component } from 'react';

import { StyleSheet, View, Text, Platform } from 'react-native';

import ViewPager from '@react-native-community/viewpager';

export default class App extends Component {

  state = {
    pageNumber: 0,
    totalPage: 2
  }

  componentDidMount() {
    var pageNumber = 0;
    setInterval(() => {
      if (this.state.pageNumber >= 2) {
        pageNumber = 0;
      } else {
    pageNumber = this.state.pageNumber;
    pageNumber++;
  }
      console.log(pageNumber)
      this.setState({ pageNumber: pageNumber })
      this.viewPager.setPage(pageNumber)
    }, 2000);
  }
  render() {
return (
  <View style={{ flex: 1 }}>
    <ViewPager style={styles.viewPager} initialPage={0}
      ref={(viewPager) => { this.viewPager = viewPager }}
      scrollEnabled={true}>
      <View key="1">
        <Text style={{ color: 'black' }}>First page</Text>
      </View>
      <View key="2">
        <Text>Second page</Text>
      </View>

      <View key="3">
        <Text>Third page</Text>
      </View>
    </ViewPager>
  </View>
    );
      }

}

const styles = StyleSheet.create({

  viewPager: {
    flex: 1,
  },

});

import React，{Component}来自'React'；
从“react native”导入{样式表、视图、文本、平台}；
从“@react native community/ViewPager”导入ViewPager；
导出默认类应用程序扩展组件{
状态={
页码：0，
总页数：2
}
componentDidMount（）{
var pageNumber=0；
设置间隔（（）=>{
如果（this.state.pageNumber>=2）{
页码=0；
}否则{
pageNumber=this.state.pageNumber；
页码++；
}
console.log（页码）
this.setState（{pageNumber:pageNumber}）
this.viewPager.setPage（页码）
}, 2000);
}
render（）{
返回(
{this.viewPager=viewPager}
scrollEnabled={true}>
首页
第二页
第三页
);
}
}
const styles=StyleSheet.create({
浏览页面：{
弹性：1，
},
});

我不知道如何实现它。