Nuxt独自

【Nuxt.js】nuxt/axiosを導入しよう

前置き

nuxt/axios

Nuxtで安全に、
そして簡単にaxiosを使えるものです✨
導入方法と
使い方を載せていきます❤️✍️

以前ご紹介したこちらは
公式の書き方$axiosを使用しておりませんでした。
申し訳ございません。
書き方は違いますが、
axiosとは何か、どういうことができるのかは
ぜひこちらを参考にしてください。
【Nuxt.js】axios導入編:かんたん・お手軽API通信

🔼の記事の書き方でもできましたが、
本来の使い方として
今回の記事を参考にしていただければと思います…🙏


導入方法

Setup

terminal

$ npm install @nuxtjs/axios

nuxt.config.jsで設定💫
オプションについてはこちら
Options

$axiosで簡単に使えるようになりました👏


使い方

Usage

$axiosで使用できます。
使い方自体は非常にシンプルですね🍀
asyncDataVuexを理解していれば
サンプルコードのような物は
簡単に書けると思います✍️

コンポーネント内

当ブログではおなじみの
JSONPlaceholderのResources
/postsを取得・表示しています🌱

asyncData

methods/created/mounted/etc


store内


まとめ

axios自体はシンプルですね💡
optionsについては触れていませんが、
proxyなどの記事を出して
それと合わせて解説を追加してもよいなぁ
と考えています🤔💭

-Nuxt独自
-,

© 2021 aLiz Nuxt