MoreHook

Appearance

Return to top
On this page

useLocalStorage

管理 localStorage

Demo

source

localData:

Usage

html
<template>
  <div>
    <p>localData: {{ localData }}</p>

    <button @click="changeData">更改data值</button>
  </div>
</template>

<script lang="ts" setup>
import { useLocalStorage } from '@morehook/core'

function changeData() {
  localData.value = Math.random()
}

const localData = useLocalStorage('a')
</script>

Type Declarations

typescript
/**
 * watch: 是否监听返回出去的值，当此值变化时同时更改 localStorage
 */
interface Options {
  watch: boolean
}
/**
 * 管理 localStorage
 * @param key 键
 * @param initialValue 初始值
 * @param options
 * @returns 返回取到的值
 */
export declare function useLocalStorage<T = any>(
  key: string,
  initialValue?: T | Ref<T>,
  options?: Options
): Ref<T | null | undefined>

Source

Source • Demo • Docs