存和取vuex

可以使用Vuex提供的store对象来存储和获取数据。在store对象中，可以定义state、mutations、actions、getters等属性和方法。

要存储数据，可以在state中定义一个数据属性，并在mutations中定义一个mutation方法来改变这个状态值。例如：

// store.js
import Vuex from 'vuex'

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

export default store

在组件中，可以使用mapMutations方法将mutation方法映射到组件中，并在需要的时候调用该方法来改变状态值。例如：

// MyComponent.vue
<template>
  <div>
    <p>{{ count }}</p>
    <button @click="increment">Increment</button>
  </div>
</template>

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

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

在这个例子中，我们定义了一个count状态值，并定义了一个increment的mutation方法来改变这个状态值。在组件中，我们使用mapState和mapMutations来将状态值和mutation方法映射到组件中，然后在点击按钮的时候调用increment方法来改变状态值。

要获取数据，可以使用mapState方法将状态值映射到组件中，并在需要的时候使用该状态值。例如：

// MyComponent.vue
<template>
  <div>
    <p>{{ count }}</p>
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  computed: {
    ...mapState(['count'])
  }
}
</script>

在这个例子中，我们使用mapState将count状态值映射到组件中，并在模板中使用该状态值来显示计数器的值。