vue mapState辅助函数

Question

想用 mapState辅助函数改写computed获取state状态

<div id="app">
  <p>{{ count }}</p>
  <p>
    <button @click="increment">+</button>
    <button @click="decrement">-</button>
  </p>
</div>

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
      increment: state => state.count++,
    decrement: state => state.count--
  }
})

new Vue({
  el: '#app',
  computed: {
    count () {
        return store.state.count
    }
  },
  methods: {
    increment () {
      store.commit('increment')
    },
    decrement () {
        store.commit('decrement')
    }
  }
})

直接引入import { mapState } from 'vuex' 不知道该怎么处理methods里面的事件

Answer 1

vuex不仅有mapState,还有mapMutations,可以在vue文件直接调用store里写的mutations,methods里不用commit

Answer 2

建议使用mapActions来做，actions一般用来处理一些与业务逻辑有关的内容，用它去触发mutations