SHARE
TWEET

Untitled

a guest Apr 24th, 2019 75 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from 'react';
  2. import SearchBar from './SearchBar';
  3. import youtube from '../apis/youtube';
  4. import VideoList from './VideoList';
  5. import VideoDetail from './VideoDetail';
  6.  
  7. class App extends React.Component {
  8.   state = {
  9.     videos: [],
  10.     selectedVideo: null
  11.   };
  12.  
  13.   componentDidMount() {
  14.     this.onTermSubmit('cars');
  15.   }
  16.  
  17.   onTermSubmit = async term => {
  18.     const response = await youtube.get('/search', {
  19.       params: {
  20.         q: term
  21.       }
  22.     });
  23.     this.setState({
  24.       videos: response.data.items,
  25.       selectedVideo: response.data.items[0]
  26.     });
  27.     console.log('YT response', this.state.videos);
  28.   };
  29.  
  30.   onVideoSelect = video => {
  31.     this.setState({
  32.       selectedVideo: video
  33.     });
  34.   };
  35.  
  36.   render() {
  37.     console.log('***********', this.state.selectedVideo);
  38.     return (
  39.       <div className="ui container">
  40.         <SearchBar onFormSubmit={this.onTermSubmit} />
  41.         <div className="ui grid">
  42.           <div className="ui row">
  43.             <div className="eleven wide column">
  44.               <VideoDetail video={this.state.selectedVideo} />
  45.             </div>
  46.             <div className="five wide column">
  47.               <VideoList
  48.                 videos={this.state.videos}
  49.                 onVideoSelect={this.onVideoSelect}
  50.               />
  51.             </div>
  52.           </div>
  53.         </div>
  54.       </div>
  55.     );
  56.   }
  57. }
  58.  
  59. export default App;
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top