[Vue warn]: inject() can only be used inside setup() or functional components.

这个警告是由于在Vue 3中，inject()只能在setup()或者函数式组件中使用，如果在模板中使用会触发警告。

解决方法：

1. 将inject()函数移动到setup()中

<template>
  ...
</template>
<script>
  import { inject } from 'vue'
  export default {
    setup() {
      const myValue = inject('myValue')
      ...
    }
  }
</script>

2. 将组件改为函数式组件

<template functional>
  ...
</template>
<script>
  import { inject } from 'vue'
  export default {
    setup(props, { attrs }) {
      const myValue = inject('myValue')
      ...
    }
  }
</script>

注意：如果你想在模板中使用inject()函数，你可以在组件的选项中添加inject属性。这将告诉Vue哪些依赖项应该注入到该组件中：

<template>
  ...
</template>
<script>
  export default {
    inject: ['myValue'],
    ...
  }
</script>

相关问题

service.ts:12 [Vue warn]: inject() can only be used inside setup() or functional components.

这个Vue警告消息告诉你，你在一个非setup()或非函数组件中尝试使用`inject()`。`inject()`是Vue 3 Composition API提供的一个特性，用于从组件的上下文中注入服务（通常是通过`provide()`在父组件中创建的服务）。它应该在`setup()`钩子或者在定义一个自定义函数组件时使用。

如果你正在使用的`service.ts`文件内容是作为组件的一部分，并且不在上述两个位置，那么你需要调整它的用法，将其移动到`setup()`函数内。如果`service.ts`是一个独立的服务文件，你应该确保在父组件的`setup()`或者导出的函数组件里使用`import`引入并在需要的地方注入。

示例：

// service.ts
export default {
  provide: () => ({
    myService: MyService // 假设MyService是你定义的一个服务
  })
}

// 在组件的setup()里注入服务
setup() {
  const myService = inject('myService');
  // ... 使用 myService ...
}