【Nuxt】Nuxt.jsでのaxios設定方法

axiosとは

PromiseベースのHTTPクライアント。
ブラウザ（クライアント）から外部APIに接続し、データの取得や更新を行う

他にもAjaxやFetchなどがあるが、Vue.jsではaxiosが使われることが多い

#　インストール方法

基本的にはプロジェクト作成時にaxiosを含めるか選択ができ、
これを選択していれば以降の設定は必要ない

手順①npmインストール

$ npm install @nuxt/axios

手順②インストール完了後、nuxt.config.jsのmoduleに以下の設定を行う

nuxt.config.js

export default {
  modules: ['@nuxtjs/axios']
}

今回使用するのはNuxt.js用のaxiosで、通常のaxiosも利用できるようですが、
こちらの方が設定の手間が省けるなどのメリットがあるそうです

#基本操作(メソッド)
$axiosで参照。

getData() {
  this.$axios.get('http://localhost:8080/').then(res => {
    //リクエスト成功時
  }).catch(err => {
    //リクエスト失敗時
  })
}