【axios】HTTPリクエストメソッド別の引数一覧表（エイリアスを使用した場合） #初心者

はじめに

PromiseベースのHTTPクライアントであるaxiosのHTTPリクエストメソッド別の引数一覧表を作成しました。（エイリアスを使用した場合）

OS: macOS Catalina 10.15.1
Vue: 2.6.10
vuex: 3.1.2
axios: 0.19.0

For convenience aliases have been provided for all supported request methods.

axiosにはHTTPリクエストを簡単に投げられるように以下のようなエイリアスが用意されています。

sample.js

axios.エイリアス(第1引数, 第2引数, 第3引数)

エイリアス	第1引数	第2引数	第3引数
request(省略可)	config	-	-
get	url	(config)	-
delete	url	(config)	-
post	url	data	(config)
put	url	data	(config)
patch	url	data	(config)

※1 configには、オブジェクトで任意のHTTPリクエストに必要な情報を渡すことが出来ます。
※2 (config)は必須ではありません。

axios.request({ //axios({ のように.request省略可
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
});

axios.get('anyUrl')

axios.post('anyUrl', anyParams)

DELETEリクエストにparamsを渡したい状況になり、以下コードを書きました。

sample.js

axios.delete('/api/v1/any', anyParams)

その前にaxiosを使って以下POSTリクエストを投げるコードが動いており、そのまま流用すればうまくいくと思っていたものの、DELETEリクエストのBodyにparamsが入ってくれませんでした。

sample.js

axios.post('/api/v1/any/create', anyParams)

以下のように修正して解決しました。

sample.js

//これではanyParamsが、paramsとして認識されない
axios.delete('/api/v1/any', anyParams)

↓

sample.js

//これでconfig扱いとなり、anyParamsをparamsとしてDELETEリクエストに含めて渡すことが出来るようになる
axios.delete('/api/v1/any', {params: anyParams })

postとdelete、同じ書き方で大丈夫と考えていたので問題の対象と捉えておらず、ハマってしまい反省です

最後まで読んで頂きありがとうございました

どなたかの参考になれば幸いです