在 Typescript 类中使用 Vue3 注入答案

【问题标题】：Use Vue3 inject inside a Typescript class在 Typescript 类中使用 Vue3 注入
【发布时间】：2022-01-13 14:19:15
【问题描述】：

我正在创建一个错误报告服务，并尝试为整个应用程序提供它。

import ErrorReporter from "@/services/error_reporter/error-reporter.service";

const app = createApp(App);

app.provide('errorReporter', new ErrorReporter());

然后像这样在 Ts 类中导入它

import {inject} from "vue";

export default class OAuthFedIdService {

    errorReporter: ErrorReporter = inject("errorReporter") as ErrorReporter;

但我在控制台内收到此警告

inject() can only be used inside setup() or functional components.

有没有办法在组件之外使用 Vue 的提供/注入功能而不会收到警告？

【问题讨论】：

您在滥用提供/注入。见stackoverflow.com/questions/70607332/…

标签： typescript vue.js inject

【解决方案1】：

不，没有办法在组件之外使用提供/注入

只需创建和导出服务的单例实例。在组件中使用inject 并在其他任何地方使用直接导入...

【讨论】：