MoreHook

Appearance

Return to top
On this page

useSessionStorage

优雅操作 sessionStorage 存储

Demo

source

sessionStorage-a:

Usage

html
<template>
  <div>
    <p>sessionStorage-a: {{ sessionStorage }}</p>

    <button @click="change">更改 sessionStorage</button>
  </div>
</template>

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

const sessionStorage = useSessionStorage<any>('a', 'cheng')

function change() {
  sessionStorage.value = Math.random()
}
</script>

Type Declarations

typescript
/**
 * watch: 是否监听返回值，当返回值更改时也会同步到 sessionStorage (默认 true)
 */
interface Options {
  watch: boolean
}
/**
 * 优雅操作 sessionStorage 存储
 * @param key 键值
 * @param initialValue 初始值
 * @param options watch: 是否监听返回值，当返回值更改时也会同步到 sessionStorage
 * @returns key代表的值 (默认为初始值)
 */
export declare function useSessionStorage<T = any>(
  key: string,
  initialValue?: T | Ref<T>,
  options?: Options
): Ref<T | null | undefined>

Source

Source • Demo • Docs