Vuex におけるミューテーションとアクションの違いは何ですか? (詳細なチュートリアル)

ここで、Vuex におけるミューテーションとアクションの違いについての詳細な説明を共有します。これは優れた参考値なので、皆さんのお役に立てれば幸いです。

アクションとミューテーションの違いは、競合状態を解決することではなく、開発ツールを使用して状態の変化を追跡できるようにすることです。

実際、vuex では、アクションは単なるアーキテクチャ上の概念であり、必要なものではありません。最終的には、ミューテーションがトリガーされる限り、アクションはただの関数です。終わり。非同期競合状態にどう対処するかはユーザー自身の仕事です。

vuex の唯一の実際の制限は、ミューテーションが同期的でなければならないことです (redux では、reducer が次の状態を同期的に返さなければならないのと似ています)。同期の意味は、各ミューテーションが実行された後、新しい状態 (reducer と同じ) に対応できるため、devtools がスナップショットを取得して保存し、自由にタイムトラベルできることです。 devtool を開いて非同期アクションを呼び出すと、呼び出した変更がいつ記録されるかを明確に確認でき、対応するステータスをすぐに確認できます。

個人テスト: ミューテーションで非同期操作が実行されると、dev-toolsでスナップショットがすぐに出力されますが、非同期操作はまだ完了しておらず、この時点のスナップショット情報は間違っています。

アクションで非同期操作を実行する場合、dev-tools は非同期操作が完了するまで待ってから、ミューテーションのスナップショットを印刷します。これにより、タイムトラベルを確認して、特定のミューテーションの変更を表示することが容易になります。

上記は私があなたのためにまとめたものです。

関連記事:

ES6 を使用して WeakMap を通じてメモリ リーク問題を解決する (詳細なチュートリアル)

vue2 でグローバル変数を設定するには? (詳細なチュートリアル)

JS で文字列連結を実装する方法 (String.prototype.format の拡張)

以上がVuex におけるミューテーションとアクションの違いは何ですか? (詳細なチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。