vue中store的用法

在Vue中，store是一个全局的状态管理器，它可以被所有的组件所访问到，并且可以在任何组件中修改状态。使用store的好处是可以让应用程序的状态变得可预测和可维护，同时也可以方便地实现数据共享和通信。

下面是一个简单的Vue中store的用法示例：

1. 首先，在应用程序的入口文件中引入Vuex，并创建一个store实例：

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

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

export default store

在上面的代码中，我们创建了一个名为count的状态，并且定义了一个名为increment的mutation，用于增加count的值。

2. 在需要使用store的组件中，使用Vuex提供的辅助函数mapState和mapMutations来访问状态和修改状态：

<template>
  <div>
    <p>{{ count }}</p>
    <button @click="increment">+</button>
  </div>
</template>

<script>
import { mapState, mapMutations } from 'vuex'

export default {
  computed: mapState(['count']),
  methods: mapMutations(['increment'])
}
</script>

在上面的代码中，我们使用mapState来映射count状态到组件的计算属性中，并使用mapMutations来映射increment mutation到组件的方法中。

这样，我们就可以在组件中访问状态和修改状态了。当我们点击按钮时，会触发increment方法，从而调用increment mutation来修改count的值。

以上就是一个简单的Vue中store的用法示例。在实际的应用中，还可以使用actions来处理异步操作，使用getters来派生状态等。