v-module綁定vuex裏面的數據
阿新 • • 發佈:2018-07-20
aps map div col 計算 class chang code ted 或者 change 事件,在事件回調中調用 action:
當在嚴格模式中使用 Vuex 時,在屬於 Vuex 的 state 上使用 v-model 會比較棘手:
<input v-model="obj.message">
假設這裏的 obj 是在計算屬性中返回的一個屬於 Vuex store 的對象,在用戶輸入時, v-model 會試圖直接修改 obj.message 。在嚴格模式中,由於這個修改不是在 mutation 函數中執行的, 這裏會拋出一個錯誤。
用“Vuex 的思維”去解決這個問題的方法是:給 <input> 中綁定 value,然後偵聽 input
<input :value="message" @input="updateMessage">
computed: { ...mapState({ message: state => state.obj.message }) }, methods: { updateMessage (e) { this.$store.commit(‘updateMessage‘, e.target.value) } }
下面是 mutation 函數:
mutations: { updateMessage (state, message) { state.obj.message = message } }
v-module綁定vuex裏面的數據