Vue.js序章Vueの計算されたプロパティを使用すると、依存関係が変更されたときにのみビューを更新する依存関係の計算でパフォーマンスを最大化しながら、複雑な操作やデータの書式設定を実行できます。この機能は同期的です。vue-async-computedパッケージでは、Promiseの解決された値をコンポーネントプロパティにバインドすることにより、コンポーネントで非同期計算プロパティを作成および使用できます。前提条件このチュートリアルを完了するには、次のものが必要です。Node.jsはローカルにインストールされます。これは、Node.jsのインストール方法とローカル開発環境の作成に従って実行できます。Vue.jsプロジェクトのセットアップおよびVue.jsコンポーネントの使用にある程度精通していると有益な場合があります。Promise、async、awaitにある程度精通していること。v2.6.11、およびvue-async-computedv3.9.0で検証されました。/cliの使用をお勧めします。注:この記事では、npxを使用して、@vue/cliのグローバルインストールを回避する方法を採用します。--default新しく作成されたプロジェクトディレクトリに移動します。vue-async-computed-examplevue-async-computedは、次のコマンドを使用してnpmからインストールできます。vue-async-computed@3.9.0次に、コードエディタでmain.jsファイルを開きます。h(App),}).$mount('#app')この時点で、vue-async-computedをサポートする新しいVueプロジェクトが作成されます。asyncComputedを使用する標準のcomputedプロパティとasyncComputedプロパティにはいくつかの違いがあります。asyncComputedプロパティにセッターを含めることはできません。Promiseが解決されるまで、defaultオプションが設定されていない限り、値はnullです。ほとんどの場合、それらをPromiseを返す計算されたプロパティとして扱うことができます。asyncComputedを使用するサンプルコンポーネントは次のとおりです。eslintのルールによっては、rejectが定義されているが、使用されていないという警告が表示される場合があります。*/のルールを無効にすることで、この問題を回避できます。awaitで書き換えることができます。}}</script>このファイルへの変更を保存します。次に、コードエディタでApp.vueファイルを開きます。新しいコンポーネントを使用するようにこのファイルを変更します。}}</script>次に、アプリケーションを実行します。serveWebブラウザでアプリケーションを観察します。最初はdefaultメッセージは表示されません。Value!"のメッセージが表示されます。Promiseが解決される前のデフォルト値は、nullです。Functionプロパティを持つオブジェクトを使用できます。default値を使用するサンプルコンポーネントは次のとおりです。}}</script>このファイルへの変更を保存します。次に、アプリケーションを実行します。serveWebブラウザでアプリケーションを観察します。Changes"が最初に表示されます。Value!"のメッセージが表示されます。結論この記事では、vue-async-computedをVueプロジェクトに適用してasyncComputedを利用しました。このパッケージの長所と短所のいくつか、およびこの機能がデフォルトでVueコアで使用できない理由に関する決定は、このGitHubの問題でキャプチャされています。Vue.jsの詳細については、Vue.jsトピックページで演習とプログラミングプロジェクトを確認してください。Joseモバイルバージョンに。