[Axios] get 방식 통신

강냉이·2021년 1월 7일
0

vue.js 리뷰

목록 보기
5/6

Axios get 방식

📌 먼저 테스트를 위해 https://reqres.in/ 에 접속하여 get방식의 LIST-USERS를 이용하여 테스트를 한다.
📌 Axios github 참조하여 Performing a GET request 부분 코드를 복사한다.

📌 예제 코드

<template>
  <div>
    <v-btn @click="getTest()">
      테스트
    </v-btn>
  </div>
</template>
<script>
import axios from "axios"
export default {
  method: {
    getTest() {
      // const axios = require('axios'); 대신 위에서 import axios from "axios"
      axios.get('https://reqres.in/api/users?page=2')
        .then(res => {
          // handle success
          console.log(res);
        })
        .catch(err => {
          // handle error
          console.log(err);
        })
        .then(() => {
          // always executed
        });
    }
  }
}
</script>

콘솔을 확인해보면 아래와 같이 response를 확인해 볼 수 있다.

Axios github의 reponse schema 와 비교해보면 콘솔에 받은 값이 정확히 들어왔다는것을 확인할 수 있다.

0개의 댓글