脱jQueryを目指してajaxメソッドをaxiosに置き換えてみる

脱jQueryを目指してajaxメソッドをaxiosに置き換えます。

準備

axiosを使うために以下のサイトからjsファイルをダウンロードして読み込んでおきます。

<script src="axios.min.js"></script>

GET通信

// jQuery
$.ajax({
  type: 'GET',
  url: 'http://localhost/test',
  params: { name: 'Taroimo' },
}).then(...);

// axios (1)
axios.get(
  'http://localhost/test',
  { name: 'Taroimo' }
).then(...);

// axios (2)
axios({
  method: 'GET',
  url: 'http://localhost/test',
  params: { name: 'Taroimo' }
}).then(...);

POST通信

// jQuery
$.ajax({
  type: 'POST',
  url: 'http://localhost/test',
  data: { name: 'Taroimo' },
}).then(...);
// axios (1)
axios.post(
  'http://localhost/test',
  { name: 'Taroimo' }
).then(...);
// axios (2)
axios({
  method: 'POST',
  url: 'http://localhost/test',
  data: { name: 'Taroimo' }
}).then(...);