axiosの使い方

目的

Vue.jsを学習中にaxiosを使う機会があったので自分用メモ程度に記載

axiosとは

非同期通信でデータを取得するためのもの
（やっていることはajaxみたいなもの）

axios使い時

JSONデータを提供しているAPIと接続して、データを取得してくることが多い

axiosのインストール

Vue.jsでaxisosを実際に使うには
1.axiosをアプリケーションにインストールする
2.CDNリンクを設置する
の2パターンがある。

axiosをインストールする

axiosのインストールはnpmかyarmでできる

#npmの場合
npm install axios
#yarnの場合
yarn add axios

CDNリンクを設置する

CDNを使ってaxiosを使う場合はheadタグに次のスクリプトタグを挿入する

<script src="https://unpkg.com/axios/dist/axios.min.js"><script>

axiosの使い方

Vueファイルの中でaxiosを使うには

Vue.js

<script>
import axios from 'axios';

export default {
  data() {
    return{
      変数名: 初期値
    }
  },
  mounted() {
    axios
      .get('URL')
      .then(response => (this.変数名 = response))
  }
}