@@ -20,40 +20,58 @@ pnpm install zero-vue
2020```
2121
2222Register plugin:
23-
2423``` js
2524import { createApp } from ' vue'
2625import { createZero } from ' zero-vue'
2726
2827const app = createApp (App)
29- app .use (createZero ())
30- ```
28+ // see docs for all options: https://zero.rocicorp.dev/docs/introduction
29+ app .use (createZero ({
30+ userID,
31+ server: import .meta.env.VITE_PUBLIC_SERVER,
32+ schema,
33+ kvStore: ' mem' ,
34+ }))
3135
32- Use ` useQuery ` :
33- ``` js
34- import { Zero } from ' @rocicorp/zero'
35- import { useQuery } from ' zero-vue'
36+ // With computed options:
37+ app .use (createZero (() => ({
38+ userID: userID .value ,
39+ server: import .meta.env.VITE_PUBLIC_SERVER,
40+ schema,
41+ kvStore: ' mem' ,
42+ })))
3643
37- // see docs: https://zero.rocicorp.dev/docs/introduction
38- const z = new Zero ({
44+ // Or with a Zero instance:
45+ app . use ( createZero ( new Zero ({
3946 userID,
4047 server: import .meta.env.VITE_PUBLIC_SERVER,
4148 schema,
4249 kvStore: ' mem' ,
43- })
44-
45- const { data: users } = useQuery (z .query .user )
50+ })))
4651```
4752
48- Optional: typing ` useZero ` :
53+ Creating ` useZero ` composable :
4954``` ts
50- import { createUseZero } from ' zero-vue' ;
51- import type { Schema } from ' ./schema.ts' ;
52- import type { Mutators } from ' ./mutators.ts' ;
53- export const useZero = createUseZero <Schema , Mutators >();
54- const z = useZero (); // z is typed with your own schema and mutators
55+ // Typed:
56+ import { createUseZero } from ' zero-vue'
57+ import type { Schema } from ' ./schema.ts'
58+ import type { Mutators } from ' ./mutators.ts'
59+ export const useZero = createUseZero <Schema , Mutators >()
60+
61+ // Untyped:
62+ import { createUseZero } from ' zero-vue'
63+ export const useZero = createUseZero ()
64+ ```
65+
66+ To query data:
67+ ``` js
68+ import { useQuery } from ' zero-vue'
69+ import { useZero } from ' ./use-zero.ts'
70+ const z = useZero ()
71+ const { data: users } = useQuery (z .value .query .user )
5572```
5673
74+
5775> [ !TIP]
5876> See [ the playground] ( ./playground ) for a full working example based on [ rocicorp/hello-zero] ( https://github.com/rocicorp/hello-zero ) , or check out [ danielroe/hello-zero-nuxt] ( https://github.com/danielroe/hello-zero-nuxt ) to see how to set things up with [ Nuxt] ( https://nuxt.com/ ) .
5977
0 commit comments