docs: fix nuxt usage (#226)

Author: sondh0127

examples/nuxt3-simple/plugins/vue-query.ts

@@ -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
@@ -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)
+    })
   }
 };