Estoy creando un reproductor de video en React que obtiene la API de yt y puedes buscar videos y los muestra. Todo funciona bien, pero cuando la aplicación se carga por primera vez, la búsqueda está vacía, así que quiero que tenga un video allí de forma predeterminada cuando se cargue, usando el componenteDidMount. pero no puedo averiguar cómo escribir mi componenteDidMount, por lo que obtiene la URL y reproduce el video cuando se procesa por primera vez.

aquí está todo mi componente de aplicación.

 class App extends React.Component { state = { videos: [], selectedVideo: null } componentDidMount() { //fetch("https://www.youtube.com/watch?v=EaswWiwMVs8") // .then((response) => response.json()) } handleSubmit = async (termFromSearchBar) => { const response = await youtube.get('/search', { params: { q: termFromSearchBar } }) this.setState({ videos: response.data.items }) console.log("this is resp", response); }; handleVideoSelect = (video) => { this.setState({ selectedVideo: video }) } render() { return ( <div className='ui container' style={{ marginTop: '1em' }}> <SearchBar handleFormSubmit={this.handleSubmit} /> <div className='ui grid'> <div className="ui row"> <div className="eleven wide column"> <VideoDetail video={this.state.selectedVideo} /> </div> <div className="five wide column"> <VideoList handleVideoSelect={this.handleVideoSelect} videos={this.state.videos} /> </div> </div> </div> </div> ) } } export default App;