Vuex--ステータス管理

目次

Vuex

とは

取付方式

使用形態

概念詳細

state

mutations

getters

Vuexとは
Vuexはコンポーネント間の共有データを保存するために誕生したもので、コンポーネント間に共有するデータがあれば、直接Vuexにマウントすることができ、親子コンポーネント間で値を送る必要はありません.コンポーネントのデータが共有する必要がない場合、共有する必要のないプライベートデータはvuexに置く必要はありません.共有するデータだけがvuexに置く必要があります.コンポーネント内部のプライベートなデータは、コンポーネントのdataに格納するだけでよい.上述したように、Vuexはグローバルに共有されたデータストレージ領域であり、データウェアハウスに相当する
props,data vuexの違い
インストール方法

はscriptタグを介して

に直接導入することができる.

npm install Vuex -Sを使用する取付

.
使用方法

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)

その後、new Vuex.Store()により、データ格納オブジェクトが得られる
例は次のとおりです.

let store =  new Vuex.Store({
	state: {
	},
	mutations: {
	},
	getters: {
	},
	action:{
	},
	module:{
	}
})

次に,実例の中のこれらの核心概念をそれぞれ述べる.
概念の詳細
state
stateはコンポーネントのdata関数のようなもので、データを格納するために特化しており、すべての共有データの定義はここにあり、コンポーネントでstoreのデータにアクセスしたい場合は、this.$store.state.**でしかアクセスできません.
mutations
storeのstate値を操作する場合は、mutationsが提供する方法を呼び出すことによってのみ、対応するデータを操作できます.stateのデータを直接操作することはお勧めしません.万が一、複数の操作がデータの乱れを引き起こし、エラーの元に迅速に位置決めできないためです.コンポーネントがmutationsのメソッドを呼び出す場合は、this.$stroe.commit(' ')を使用してのみ操作できます.もう一つ注目すべきは、mutationsの関数パラメータリストでは、最大2つのパラメータがサポートされています.パラメータ1:stateの状態、パラメータ2:commitでコミットされたパラメータです.
getters
gettersの方法は主に他のコンポーネントにstate中値を取得する方法を提供するためであり、需要シーンはstoreのstate上のデータが対外的に提供されるときにパッケージ化する必要がある場合、gettersが発揮する時であり、gettersを使用する必要がある場合、this.$store.getters.**で呼び出す.