fargo
1a822493ba
963 markdown files reformatted with the repository's pinned prettier so pnpm format:check covers the folded tree like every other repo file. The formatter's embedded-language pass also normalized code fences (TS semicolons, closed HTML tags in examples, lowercased CSS hex colors, one renumbered list that skipped an index). Alphanumeric token deltas vs the fold commit were audited file-by-file; all are formatter-equivalent markup normalizations plus the four sanitized skills.
1.8 KiB
1.8 KiB
category
| category |
|---|
| @Integrations |
useIDBKeyval
Wrapper for idb-keyval.
Install idb-keyval as a peer dependency
npm install idb-keyval@^6
Usage
import { useIDBKeyval } from '@vueuse/integrations/useIDBKeyval';
// bind object
const { data: storedObject, isFinished } = useIDBKeyval('my-idb-keyval-store', {
hello: 'hi',
greeting: 'Hello',
});
// update object
storedObject.value.hello = 'hola';
// bind boolean
const flag = useIDBKeyval('my-flag', true); // returns Ref<boolean>
// bind number
const count = useIDBKeyval('my-count', 0); // returns Ref<number>
// awaiting IDB transaction
await count.set(10);
console.log('IDB transaction finished!');
// delete data from idb storage
storedObject.value = null;
Type Declarations
interface Serializer<T> {
read: (raw: unknown) => T;
write: (value: T) => unknown;
}
export interface UseIDBOptions<T> extends ConfigurableFlush {
/**
* Watch for deep changes
*
* @default true
*/
deep?: boolean;
/**
* On error callback
*
* Default log error to `console.error`
*/
onError?: (error: unknown) => void;
/**
* Use shallow ref as reference
*
* @default false
*/
shallow?: boolean;
/**
* Write the default value to the storage when it does not exist
*
* @default true
*/
writeDefaults?: boolean;
/**
* Custom data serialization
*/
serializer?: Serializer<T>;
}
export interface UseIDBKeyvalReturn<T> {
data: RemovableRef<T>;
isFinished: ShallowRef<boolean>;
set: (value: T) => Promise<void>;
}
/**
*
* @param key
* @param initialValue
* @param options
*/
export declare function useIDBKeyval<T>(
key: IDBValidKey,
initialValue: MaybeRefOrGetter<T>,
options?: UseIDBOptions<T>,
): UseIDBKeyvalReturn<T>;