title: react-native-video: how to load next video on clicking a button?
body: <p>I have an array of videos, called <code>VIDEOS [ ]</code> whose index increments +1 when i click a button. The button fires a function <code>nextVideo()</code> .</p>
  
  <p>I'm using react-native-video</p>
  
  <p>How do i get the player to play the next video?
  So </p>
  
  <pre><code>&lt;Video source={{uri: VIDEOS[currentVideo]}} /&gt; 
  </code></pre>
  
  <p>needs to reload in my <code>render()</code> function in <code>App.js</code> with the updated counter called <code>currentVideo</code>.</p>
  
  <p>Code below:</p>
  
  <pre><code>constructor(props) {
      super(props);
  
      //Video properties
      this.state = {
          repeat: false,
          paused: false,
      };
      //VIDEO index variable
      global.currentVideo = 0;
   }
  
    nextVideo() { 
      //Skip video when button is pressed to next video in list
      if (global.currentVideo != VIDEOS.length-1)
      {
          global.currentVideo = global.currentVideo + 1;
      }
      else
      {
          global.currentVideo = 0;
      }
     }
  
   render() {
      return (
          &lt;View style={styles.container}&gt;
            &lt;View style={styles.video}&gt;
             &lt;Video 
              source={{uri: VIDEOS[global.currentVideo]}}
              ref={(ref) =&gt; {this._player = ref}}
              style={styles.video}
             /&gt;    
            &lt;/View&gt;
            &lt;View style={styles.button}&gt;
              &lt;Button
                onPress={this.nextVideo}
              /&gt;
            &lt;/View&gt;
          &lt;/View&gt;
    );
  </code></pre>