MovieRankingTab.js 2.05 KB
import React, { Component } from 'react';
import { View, Text, StyleSheet, Image} from 'react-native';
import { Icon } from 'native-base';
import { AsyncStorage } from "react-native";
import axios from "axios";

const API_KEY = "2bf00f660b1a6a3ffeb6e06ac270cce3";
const NAVER_CLIENT_ID = "KqPsntd1hcPJ8FUPBGqN";
const NAVER_CLIENT_SECRET = "0GRb3uya1U";


export default class MovieRankingTab extends Component {
    static navigationOptions = {
        tabBarIcon: ({ tintColor }) => (
            <Icon name='ios-trophy' style={{ color: tintColor }} />
        )
    };
    
      getNaverApi = async () => {
        fetch("https://openapi.naver.com/v1/search/movie.json?query='겨울왕국 2'", {
          headers: {
            "X-Naver-Client-Id": NAVER_CLIENT_ID,
            "X-Naver-Client-Secret": NAVER_CLIENT_SECRET
          }
        })
          .then(response => response.json())
          .then(json => {
                console.log(json.items[0].image);
          });
      };
      getMovieList = async () => {
        axios
          .get(
            `http://www.kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchDailyBoxOfficeList.json?key=${API_KEY}&targetDt=20191129`
          )
          .then(response => {
            for (var i = 0; i < 10; i++) {
              console.log(
                response.data.boxOfficeResult.dailyBoxOfficeList[i].movieNm
              );
            }
          })
          .catch(error => {
            console.log(error);
          });
      };
      componentDidMount() {
        this.getMovieList();
        this.getNaverApi();
      }

    render() {
        return (
            <View style={style.container}>
                <Text>MovieRanking</Text>
                <Image
                    style = {{height:'25%',width: '25%'}}
                    source={{uri : "https://ssl.pstatic.net/imgmovie/mdi/mit110/1368/136873_P18_100537.jpg" }}/>
            </View>
        );
    }
}

const style = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
    }
});