我使用Vue.extend手动将一个组件安装到动态元件上,如下所示:

import Vue from 'vue';
import MyComponent from 'MyComponent.vue';

const MyComponentConstructor = Vue.extend(MyComponent);
const MyComponent = new MyComponentConstructor({
    propsData: {
        foo: 123,
    },
}).$mount('#mount-point');

当我以这种方式手动安装组件时,我不能在MyComponent.vue中使用vuex

// (inside MyComponent.vue)
this.$store.commit('setSomething', true);

我明白了:

未捕获的TypeError:无法读取未定义的属性"commit"

当然,vuex已经设置好,在其他正常组件中运行良好.有什么东西我可以传递给构造器让它工作吗?

推荐答案

将存储作为选项的一部分传递给构造函数.

import store from "path/to/store"

const MyComponent = new MyComponentConstructor({
    store,
    propsData: {
        foo: 123,
    },
}).$mount('#mount-point');

Vue.js相关问答推荐

在Nuxt项目中混合Scrolltrigger与Lenis

如何使用Nuxt 3动态处理无限嵌套路由?

我可以将Created()中内置的内容传递给Provide属性吗?

正在try 访问vutify中v-select(ItemProps)的嵌套json值

vuetify/mdi 不显示图标

Nuxt 和 Vite 有什么区别?

如果在 VueJS/VuetifyJS 中切换switch,则调用函数

Vuetify grid layout - 如何填充网格中元素的高度

VueJS:在组件之间使用全局对象的最佳实践?

运行vue-cli-service build --watch时没有 CSS 文件

使用 Vue 和 JS 下载 CSV 文件

使用 VueJS 在 v-for 中转换

如何在 Node.js 服务器上部署 Vue.js 应用程序

使用props向组件添加类名

即使在生产模式下构建,VueJS 也会显示开发模式开发模式消息

'vue' 未被识别为内部或外部命令

Vuetify 数据表不显示数据

标签中的 href 赋值

Vue组件如何命名

Mapbox 事件监听器