双向绑定和 vuex 是否冲突 ？

在属于 Vuex 的 state 上使用 v-model，在用户输入时，v-model 会试图直接修改 obj.message，在严格模式中，不是在 mutation 函数中修改的state, 就会抛出一个错误。

const store = createStore({
  // ...
  strict: true
})

<input v-model="obj.message">

解决方法：

• 方法1. 用“Vuex 的思维”去解决这个问题的方法是：给 <input> 中绑定 value，然后侦听 input 或者 change 事件，在事件回调中调用一个方法:

<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
  }
}

• 方法2. 双向绑定的计算属性

<input v-model="message">

computed: {
  message: {
    get () {
      return this.$store.state.obj.message
    },
    set (value) {
      this.$store.commit('updateMessage', value)
    }
  }
}

mutations: {
  updateMessage (state, message) {
    state.obj.message = message
  }
}