ステート
アプリケーションの状態(データ)を管理します。
定義
作成するのは、ただの Object です。
初期値
state: {}でも構いません。
const store = new riotx.Store({
state: {}
})
// or
const store = new riotx.Store({
state: {
name: {
lastName: 'yamada',
firstName: 'taro'
}
},
mutations: {
nameMutation: context => {
context.state.name.lastName = 'tanaka';
return ['nameChangeMutation'];
}
}
})
操作
ステートの操作には、ルールがあります。
追加、編集、削除
graph LR
Actions((Actions))-- commit -->Mutations
Mutations((Mutations))-- Mutates-->State
アクション -> ミューテーション を経由して操作する必要があります。
取得
graph LR
Getters((Getters))-- Filter -->State
ゲッター を経由して操作する必要があります。
変更を監視して取得
graph LR
Getters((Getters))-- Filter -->State
State-- "Change events (trigger)" --> CustomTag((Custom Tag))
State-- "Change events (trigger)" --> Store((Store))
<script>
// riotのカスタムタグ経由
this.riotxChange('nameChangeMutation', (state, store) => {
/** ... */
});
// ストア経由
store.change('nameChangeMutation', (state, store) => {
/** ... */
});
</script>