2

我有一个使用正在调用的组件的 npm 包inject

<template>
  <div>{{ hub.message }}</div>
</template>
<script>
import { inject } from "@vue/composition-api";
export default {
  name: "test",
  setup() {
    const hub = inject("HUB");

    return { hub };
  },
};
</script>

在 lib package.json 中,我已设置@vue/composition-api为开发和对等依赖项。

在我的主项目(不是库)中,我正在注册 Composition API 并使用如下提供:

import Vue from "vue";
import VueCompositionApi from "@vue/composition-api";
Vue.use(VueCompositionApi);
import App from "./App.vue";

import { hub } from "../lib/hub";
import { provide } from "@vue/composition-api";

Vue.config.productionTip = false;

new Vue({
  setup() {
    provide("HUB", hub);
  },
  render: h => h(App)
}).$mount("#app");

Hub 是一个简单的对象:

export const hub = {
  message: null,

  init: function() {
    this.message = "I'm here";
  },
};

但我越来越 Error in data(): "Error: [vue-composition-api] "inject" get called outside of "setup()""

我还准备了一个小演示来演示这个问题: https ://github.com/JiProchazka/composition-api-test

有任何想法吗?

谢谢

4

0 回答 0