20.vue.jsとaxiosで名前一覧を表示:index.html
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン | ||
20.vue.jsとaxiosで名前一覧を表示:index.html [2019/02/08] – [すること] adash333 | 20.vue.jsとaxiosで名前一覧を表示:index.html [2019/02/08] (現在) – [Vue.jsにaxiosをインストールしてWeb APIの情報を取得してリスト表示] adash333 | ||
---|---|---|---|
行 16: | 行 16: | ||
DEMO | DEMO | ||
+ | < | ||
+ | <iframe src=" | ||
+ | </ | ||
+ | |||
行 76: | 行 80: | ||
これで、App.vueの土台が出来上がりました。 | これで、App.vueの土台が出来上がりました。 | ||
+ | |||
+ | ===== Vue.jsにaxiosをインストールしてWeb APIの情報を取得してリスト表示 ===== | ||
+ | -Add Dependencyから、axiosをインストール | ||
+ | -App.vueにaxiosをインポート | ||
+ | -axiosを用いてAPI通信 | ||
+ | -APIで取得した値を画面に表示 | ||
+ | |||
+ | {{: | ||
+ | |||
+ | < | ||
+ | <script src=" | ||
+ | </ | ||
+ | |||
+ | App.vue | ||
+ | (変更前) | ||
+ | {{: | ||
+ | (変更後) | ||
+ | {{: | ||
+ | |||
+ | 今回は以上となります。 | ||
+ | |||
+ | ===== ソースコード ===== | ||
+ | ソースコード | ||
+ | https:// | ||
+ | |||
+ | DEMO | ||
+ | < | ||
+ | <iframe src=" | ||
+ | </ | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
20.vue.jsとaxiosで名前一覧を表示/index.html.txt · 最終更新: 2019/02/08 by adash333