Skip to content

Commit

Permalink
docs: fix nuxt usage (#226)
Browse files Browse the repository at this point in the history
  • Loading branch information
sondh0127 authored Aug 16, 2022
1 parent ad4cb0f commit c0fde8b
Showing 1 changed file with 10 additions and 7 deletions.
17 changes: 10 additions & 7 deletions examples/nuxt3-simple/plugins/vue-query.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
import type { DehydratedState, VueQueryPluginOptions} from 'vue-query'
import {
VueQueryPlugin,
VueQueryPluginOptions,
QueryClient,
hydrate,
dehydrate,
} from "vue-query";
// Nuxt 3 app aliases
import { useState} from '#app'

export default (nuxt) => {
// Modify your Vue Query global settings here
Expand All @@ -14,18 +16,19 @@ export default (nuxt) => {
const options: VueQueryPluginOptions = { queryClient };

nuxt.vueApp.use(VueQueryPlugin, options);
const vueQueryClient = useState<DehydratedState | null>('vue-query')

// @ts-expect-error Nuxt process variable
if (process.server) {
nuxt.hooks.hook("app:rendered", () => {
nuxt.nuxtState["vue-query"] = dehydrate(queryClient);
});
nuxt.hooks.hook('app:rendered', () => {
vueQueryClient.value = dehydrate(queryClient)
})
}

// @ts-expect-error Nuxt process variable
if (process.client) {
nuxt.hooks.hook("app:created", () => {
hydrate(queryClient, nuxt.nuxtState["vue-query"]);
});
nuxt.hooks.hook('app:created', () => {
hydrate(queryClient, vueQueryClient.value)
})
}
};

1 comment on commit c0fde8b

@vercel
Copy link

@vercel vercel bot commented on c0fde8b Aug 16, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

vue-query – ./

vue-query-git-main-damianosipiuk.vercel.app
vue-query.vercel.app
vue-query-damianosipiuk.vercel.app

Please sign in to comment.