搜索
使用Nuxt Composition API和Nuxt Apollo模块的技巧和指南
P粉134288794
P粉134288794 2023-08-26 11:07:26
[Vue.js讨论组]
<p>为什么我可以在nuxt组合API中使用nuxt apollo模块?如果我尝试使用这个插件示例:</p> <pre class="brush:php;toolbar:false;">import {Context} from '@nuxt/types' import { provide, onGlobalSetup, defineNuxtPlugin } from '@nuxtjs/composition-api' import {DefaultApolloClient} from '@vue/apollo-composable/dist' /** * 这个插件将连接@nuxt/apollojs和@vue/apollo-composable */ export default defineNuxtPlugin(({app}: Context): void =&gt; { onGlobalSetup(() =&gt; { provide(DefaultApolloClient, app.apolloProvider?.defaultClient) }) })</pre> <p>我得到了这个错误:<code>Error: Apollo client with id default not found. Use provideApolloClient() if you are outside of a component setup</code></p>
P粉134288794
P粉134288794

全部回复(1)
P粉399585024
  1. 安装 vue/apollo-composable: npm install --save @vue/apollo-composable

  2. 创建 nuxt 插件(provide-apollo-client.ts):

import { Context } from '@nuxt/types'
import {
  onGlobalSetup,
  defineNuxtPlugin
} from '@nuxtjs/composition-api'
// @ts-ignore
import { provideApolloClient } from '@vue/apollo-composable'

/**
 * This plugin will connect @nuxt/apollojs with @vue/apollo-composable
 */

export default defineNuxtPlugin(({ app }: Context): void => {
  onGlobalSetup(() => {
    provideApolloClient(app.apolloProvider?.defaultClient)
  })
})
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号