alova.js クイックスタートチュートリアル

公式ウェブサイトのアドレス: Alova.JS - 軽量リクエスト戦略ライブラリ | Alova.JS

1. アロバとは何ですか?

alova は、さまざまなリクエストシナリオに対応するリクエストモジュールを使用する軽量のリクエストストラテジライブラリであり、開発者が非常に少量のコードで高可用性と流暢性の高いリクエスト機能を実現できるようになります。リクエスト最適化コードを自分で作成します。リクエストデータと関連ステータスを自分で管理する必要はなくなりました。リクエストモジュールを選択して使用するだけで済みます。パラメータを設定した後は、alova がお手伝いします。これにより、開発効率、アプリケーションの運用効率が向上し、サーバーの負荷が軽減されます。

2. クイックスタート

1. 依存関係をインストールする

(1) npmでインストールする

npm install alova --save

(2) ヤーン方式でインストールする

yarn add alova

ヒント: alova は UI フレームワークを組み合わせて、リクエストをよりシンプルにします。alovaが提供するuse フックを使用してリクエストを開始できます。これは、たとえばloading、複数のリクエストに関連するステートフルデータを返し、何もしなくても alova でそれらを自動的に管理します自分でメンテナンスしてください。

alova を使用する場合は、UI フレームワークが次のバージョン要件を満たしていることを確認してください。

反応: v16.8 以上
Vue: 2.7、3.x
細い: 任意

2.静的HTMLで使用

<!DOCTYPE html>
<html lang="en">
  <head>
    <script src="https://unpkg.com/alova/dist/alova.umd.min.js"></script>
    <script src="https://unpkg.com/alova/dist/adapter/globalfetch.umd.min.js"></script>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <!-- vuehook依赖 vue，因此需先引入 vue -->
    <script src="https://unpkg.com/alova/dist/hooks/vuehook.umd.min.js"></script>
    <script>
      const alovaInstance = window.alova.createAlova({
        baseURL: 'https://api.alovajs.org',
        statesHook: window.VueHook,
        requestAdapter: window.GlobalFetch()
      });
      // ...
    </script>
  </head>
  <body>
    <!-- ... -->
  </body>
</html>

alova.js の使用方法の詳細については、公式ドキュメントを参照してください: Alova.JS - 軽量リクエスト戦略ライブラリ | Alova.JS

alova.js クイック スタート チュートリアル