如何从 Quasar V2 Composition API 设置功能访问引导文件配置的 axios？

Question

如何从 Quasar V2 Composition API 设置功能访问启动文件配置的 axios，而不需要在每个文件中导入 axios？

由于this.$axios只能用于Options API，我尝试通过setup函数的context参数访问。

尽管它有效，但 context.root 现在在 Vue 3 中已被弃用。

我不想在每个文件中都导入 axios，如 https://next.quasar.dev/quasar-cli/ajax-requests 的示例所示

对于设置方法访问，我认为它仍然没有实现，因为在https://next.quasar.dev/quasar-cli/boot-files#examples-of-appropriate-usage-of-boot-files 中提到它作为 TODO 活动

与 axios 类似，vue-i18n 的使用也来自引导文件对我来说是个问题。

 setup (props, context) {
         
    context.root.$axios({
    method: 'get',
        url: 'http://localhost:8080/storemgr/item/3',
      }).then((response: any) => {
          console.log(response)
      }).catch((error: any) => {
        console.log(error)
      })
...
}

下面是我用 Quasar V2 CLI 生成的 axios 引导文件内容

import axios, { AxiosInstance } from 'axios'
import { boot } from 'quasar/wrappers'

declare module 'vue/types/vue' {
  interface Vue {
    $axios: AxiosInstance;
  }
}

export default boot(({ Vue }) => {
  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
  Vue.prototype.$axios = axios
})

Answer 1

我发现的唯一其他方法是使用Provide/Inject。 在我的引导文件中，我这样使用它：

export default boot(({ app }) =>
{
  app.config.globalProperties.$axios = axios
  app.provide('axios', app.config.globalProperties.$axios)
})

在任何组件中：

 setup ()
      {
        const axios: AxiosInstance = inject('axios') as AxiosInstance
        [...]
      }

事后看来，我不太确定这是否比导入它更好。 ¯_(ツ)_/¯