feat .calude

.claude/skills/vueuse-functions/references/useRTDB.md

@@ -0,0 +1,70 @@
+---
+category: '@Firebase'
+---
+
+# useRTDB
+
+Reactive [Firebase Realtime Database](https://firebase.google.com/docs/database) binding. Making it straightforward to **always keep your local data in sync** with remotes databases.
+
+## Usage
+
+```ts
+import { useRTDB } from '@vueuse/firebase/useRTDB'
+import { initializeApp } from 'firebase/app'
+import { getDatabase } from 'firebase/database'
+
+const app = initializeApp({ /* config */ })
+const db = getDatabase(app)
+
+// in setup()
+const todos = useRTDB(db.ref('todos'))
+```
+
+You can reuse the db reference by passing `autoDispose: false`
+
+```ts
+const todos = useRTDB(db.ref('todos'), { autoDispose: false })
+```
+
+or use `createGlobalState` from the core package
+
+```ts twoslash include store
+// @filename: store.ts
+// ---cut---
+// store.ts
+import { createGlobalState } from '@vueuse/core'
+import { useRTDB } from '@vueuse/firebase/useRTDB'
+
+export const useTodos = createGlobalState(
+  () => useRTDB(db.ref('todos')),
+)
+```
+
+```vue
+<!-- app.vue -->
+<script setup lang="ts">
+// @include: store
+// ---cut---
+import { useTodos } from './store'
+
+const todos = useTodos()
+</script>
+```
+
+## Type Declarations
+
+```ts
+export interface UseRTDBOptions {
+  errorHandler?: (err: Error) => void
+  autoDispose?: boolean
+}
+/**
+ * Reactive Firebase Realtime Database binding.
+ *
+ * @see https://vueuse.org/useRTDB
+ */
+export declare function useRTDB<T = any>(
+  docRef: DatabaseReference,
+  options?: UseRTDBOptions,
+): Ref<T | undefined, T | undefined>
+```