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");

ハブは単純なオブジェクトです:

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