Vue Mixin: 将 Store 添加到组件中

在 Vue 中，可以使用 mixin 将 store 添加到组件中。下面是一个示例：

首先，创建一个 store.js 文件来定义 store 对象和相关的 state、mutations、actions 等内容：

// store.js
export default {
  state: {
    count: 0
  },
  mutations: {
    increment(state) {
      state.count++;
    }
  },
  actions: {
    increment(context) {
      context.commit('increment');
    }
  }
}

然后，在需要使用 store 的组件中，通过 mixin 引入 store：

// MyComponent.vue
import store from './store.js';

export default {
  mixins: [store],
  computed: {
    count() {
      return this.$store.state.count;
    }
  },
  methods: {
    increment() {
      this.$store.dispatch('increment');
    }
  }
}

在上面的示例中，我们通过 mixin 将 store 对象添加到组件中。然后，可以在 computed 属性中使用 this.$store.state.count 来获取 state 中的 count 值，在 methods 中使用 this.$store.dispatch('increment') 来调用 action 中的 increment 方法。

注意，需要在 Vue 实例中引入 store 对象，例如：

// main.js
import Vue from 'vue';
import App from './App.vue';
import store from './store.js';

new Vue({
  render: h => h(App),
  store
}).$mount('#app');

这样，store 就能在组件中正常使用了。