35 lines
772 B
TypeScript
35 lines
772 B
TypeScript
/**
|
|
* LocalStorage composable
|
|
* 通用的 localStorage 操作
|
|
*/
|
|
|
|
import { watch, type Ref } from 'vue'
|
|
|
|
export function useLocalStorage<T>(
|
|
key: string,
|
|
defaultValue: T,
|
|
storage: Storage = localStorage
|
|
): [Ref<T>, (value: T) => void, () => void] {
|
|
const stored = storage.getItem(key)
|
|
const value = ref<T>(stored ? JSON.parse(stored) : defaultValue)
|
|
|
|
const setValue = (newValue: T) => {
|
|
value.value = newValue
|
|
}
|
|
|
|
const clearValue = () => {
|
|
value.value = defaultValue
|
|
storage.removeItem(key)
|
|
}
|
|
|
|
watch(value, (newValue) => {
|
|
try {
|
|
storage.setItem(key, JSON.stringify(newValue))
|
|
} catch (e) {
|
|
console.warn(`Failed to save ${key} to localStorage:`, e)
|
|
}
|
|
}, { deep: true })
|
|
|
|
return [value, setValue, clearValue]
|
|
}
|