1. 補助機能コンポーネントが複数の状態を取得する必要がある場合、これらすべての状態を計算プロパティとして宣言すると、多少の繰り返しと冗長性が生じます。この問題を解決するには、計算されたプロパティを生成する スクリプトに補助関数を導入します。 'vuex' から { mapState、mapMutations、mapActions、mapGetters } をインポートします。 2. 例1. mapState と mapGetters 例えば: これで、ストアの状態にプロパティ userName が存在します。 Home.vue コンポーネントでは、mapState を通じて取得され、インターフェースに表示されます。 計算されたコード: 計算:{ //補助関数を通じてストア内の状態を取得する ...mapState(['ユーザー名']) //同等: 次の通常の計算プロパティコード /* userName (){ this.$store.state.userName を返します }*/ } ページの呼び出し: 結果: このように、単純な 2. mapMutations と mapActions 例えば: 現在、 上の図の 方法:{ // ストア内のミューテーションを取得するための略語 ...mapMutations(['tip']) ///* tip(){ と同等 this.$store.commit('tip'); }*/ } コンポーネントの呼び出し: 上記の例からわかるように、補助関数の利点は、ストア内の状態、ゲッター、ミューテーション、アクションの取得を簡素化できることです。もちろん、補助機能を使用しなくても上記の機能を実現できますが、コンポーネント内で複数の状態を同時に使用する必要がある場合は、補助機能を使用すると便利になります。 以上で、VueのVuexの4つの補助機能についての記事は終了です。Vuexの補助機能に関するより詳しい内容は、123WORDPRESS.COMの過去記事を検索するか、以下の関連記事を引き続き閲覧してください。今後とも123WORDPRESS.COMをよろしくお願いいたします。 |
<<: MySQL データベース内の varchar 型の数値のサイズを比較する方法
>>: Linux環境でログファイルを表示するコマンドの詳細な説明
今夜の夕食後にノートパソコンの電源を入れたところ、問題が発生しました。通常、コンピューターがスリープ...
UI カットのプロセスでは、ページはヘッダー、コンテンツ、フッターの 3 つの部分で構成されることが...
目次コードの実行に長い時間がかかる場合はどうなりますか? Axiosにはタイムアウト処理機能が搭載さ...
コードをコピーコードは次のとおりです。 <スタイル タイプ="text/css&qu...
1. --cpu=<値> 1) コンテナが使用できるCPUリソースの量を指定しますが、コ...
この記事の例では、ショッピングカート機能を実装するためのvuexの具体的なコードを参考までに共有して...
データベースインデックスについては皆さんもよくご存知だと思います。 インデックスは、データベース テ...
まとめインタビュー中、MySQL インデックスの問題について議論しているときに、B+ ツリー、B ツ...
0. はじめにibdata1 ファイルとは何ですか? ibdata1 は、innodb システム テ...
MySQLクエリ期間の交差使用シナリオデータベース テーブルには、starttime と endti...
Nginx は C 言語で開発されており、Linux で実行することをお勧めします。もちろん、Win...
1. まず、Linux サーバー上で公開鍵ファイルと秘密鍵ファイルを生成します。デフォルトの保存ディ...
この記事では、Docker コンテナとフロントエンド プロセスの関係と、コンテナを永続的に実行できる...
フローティング、フローティング埋め込み div、配置、フレックスという 4 つの一般的な方法と原則を...
Ⅰ. 問題の説明: CSS を使用して画像の 3D 凸凹効果を実現します。 Ⅱ実施手順は以下のとお...