有没有办法将 Vuex 添加到 Vue 插件安装功能并在其组件之间共享状态？

Question

基本上我想在 vue 安装和 vue 组件中使用我自己的商店，我通过我的 vue 插件添加。

我发现我可以在实际安装函数中使用 vuex 并做 vuex 可以做的一切，但我似乎无法将它传递给我的自定义组件。

是否有任何其他方法可以在我的 SFC 中添加我在插件中添加的全局事件？

import MyComponent from './MyComponent.vue'
import MySecondComponentfrom './MySecondComponent.vue'
import Vuex from 'vuex'
import store from './store.js'

const CustomFn = function(message, options) {
    this.$store.dispatch("someRandomAction", { message, options })
}

export default {
    install(Vue, options) {
        if (this.installed) { return }
        this.installed = true

        Vue.use(Vuex)

        const storeInstance = new Vuex.Store(store)

        Vue['store'] = storeInstance

        // is there a way to add storeInstance to my own components and share one state between them?
        Vue.component('MyComponent', Vue.extend(MyComponent))
        Vue.component('MySecondComponent', Vue.extend(MySecondComponent))

        Vue.prototype['$doStuff'] = CustomFn
        Vue['doStuff'] = CustomFn
    }
}

问题是我无法在 MyComponent 中传递这个 Vuex 存储实例并在多个组件之间共享同一个存储。

Answer 1

自定义组件属性应该通过将它们分配给 Vue.prototype 在 Vue 2 中全局提供，因为组件实例原型继承自它。

如果 store 已经是 Vuex 存储而不是包含存储选项的普通对象，则

new Vuex.Store(store) 是一个错误。这将导致存储出现故障，如 this question 所示。即使 store 还不是存储实例，使它成为一个实例并在单独的模块中导出是有意义的，这样它就可以在 non-component 模块中导入。

应该是：

Vue.prototype.$store = store

有没有办法将 Vuex 添加到 Vue 插件安装功能并在其组件之间共享状态？

Is there a way to add Vuex to Vue plugin install function and share state between its components?

javascript

vue.js

vue-component

vuex

vuejs2