Vuex使った時にフォームのバインディングにv-model使うと怒られる問題の解決法
Vuex使った時にフォームのバインディングにv-model使うと怒られる問題の 最終的な私の答え。
eventでvalueとキーネームを飛ばして ミューテーションでキーネーム付け合わせて、 バーンて入れるだけ。
これならミューテーションにupdateHogeを入力項目ごとに書かなくて済む。
inputにはこれを書いて
:value="blogForm.title" @input="updateBlogForm($event, 'title')"
inputのあるコンポーネントのmethodにはこれを書いて
updateBlogForm(e, key_name) {
this.$store.commit('updateBlogFormValue', { value:e.target.value, key_name });
}
ストアにこれを書くだけ
updateBlogFormValue (state, { value, key_name }) {
state.blogForm[key_name] = value;
},
思いついたときに感動した。