问React : TypeError:无法读取未定义的属性“视频”

EN

import React, { Component, useEffect, useState } from 'react';
import './App.css';

var source = '/Videos/Part1.mp4';

var videos = [
  {
    Chapitre: 'Intro',
    video: '/Videos/part0 - training 1.mp4'
  },
  {
    Chapitre: 'The need of 5G',
    video: '/Videos/Part1.mp4'
  },
  {
    Chapitre: '5G potential use cases',
    video: '/Videos/Part 2.mp4'
  },
  {
    Chapitre: '5G technical requirements',
    video: '/Videos/Part 3.mp4'
  },
  {
    Chapitre: 'Timeline for 5G standards and roll out',
    video: '/Videos/Part 4.mp4'
  },
  {
    Chapitre: 'Quiz',
    video: '/Videos/Part 5.mp4'
  }
];

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      indice: 0
    }
    //this.SelectChapiter = this.SelectChapiter.bind(this);
    this.Next = this.Next.bind(this);
    //this.Previous = this.Previous.bind(this);
  }
  

  SelectChapiter(index) {
    this.setState({ indice: index });
    document.getElementById('change').src = videos[index].video;
};

Next () {
  alert(videos[this.state.indice].video)
  if(this.state.indice != 5){
    //this.setState({ indice: this.state.indice + 1 });
    this.SelectChapiter(this.state.indice + 1);
    
  }
};

Previous () {
  alert(this.state.indice)

  if(this.state.indice != 0){
    //this.setState({ indice: this.state.indice + 1 });
    this.SelectChapiter(this.state.indice - 1);
}
}
  render() { 
    return (
      <div>
        <div className="LeftNav">
          <div className="FormationName">5G Associate Training_01M01</div>
          <div id="Obj">Objective of training</div>
          <ul className= "chapitres">
            <button onClick={() => this.SelectChapiter('0')}>Intro</button><br/>
            <button onClick={() => this.SelectChapiter('1')}>The need of 5G</button>
            <button onClick={() => this.SelectChapiter('2')}>5G potential use cases</button>
            <button onClick={() => this.SelectChapiter('3')}>5G technical requirements</button>
            <button onClick={() => this.SelectChapiter('4')}>Timeline for 5G standards</button><br/>
            <button onClick={() => this.SelectChapiter('5')}>Quiz</button>
          </ul>
        </div>
  
        <div className="control">
          <input onClick={this.Previous} className="icon" type="image" src="/Assets/previous.png" />
          <input onClick={this.Next} className="icon" type="image" src="/Assets/next.png" />
        </div>
        <video className="VidéoSection" id = "change" controls>
            <source src='/Videos/part0 - training 1.mp4' type="video/mp4"/>
          Your browser does not support the video tag.
        </video>
      </div>
  
      
    );
  }
}

export default App;