Vue Hooks API

createLocalStorage()

使用 localStorage 创建一个存储模块

类型

function createLocalStorage<T>(options: CreateStorageOptions<T>): SoftStorage<T>;

参数

• options: CreateStorageOptions<T>

  type CreateStorageOptions<T> = {
    /* 存储模块的key（必须是唯一的）*/
    storageModuleKey: string;
    /* 用于初始化存储模块（非空属性必须有默认值，可选属性不能有默认值） */
    initial: PickNonNullable<T>;
    /* 是否开启模块保护 */
    protect?: boolean;
    /* 存储模块的版本号 */
    version?: number;
    /* 存储模块的上一个版本号 */
    preVersion?: number;
  };
  

返回值

返回一个对象（SoftStorage），该对象包括useStorage 和 useStorageHelper所必需的变量

示例

type UserInfo = {
  token?: string;
  hasSigned: boolean;
};

export const storage = createLocalStorage<UserInfo>({
  storageModuleKey: 'user_info',
  initial: { hasSigned: false },
});

createSessionStorage()

使用 sessionStorage 创建一个存储模块

类型

function createSessionStorage<T>(options: CreateStorageOptions<T>): SoftStorage<T>;

参数

与 createLocalStorage() > 参数 相同

返回值

与 createLocalStorage() > 返回值 相同

示例

type UserInfo = {
  token?: string;
  hasSigned: boolean;
};

export const storage = createSessionStorage<UserInfo>({
  storageModuleKey: 'user_info',
  initial: { hasSigned: false },
});

useStorage()

从存储模块中获取 refs、resetters 和 checkers

类型

function useStorage<T>(storage: SoftStorage<T>): StorageReactions<T>;

参数

• storage: SoftStorage<T>

  createLocalStorage或者createSessionStorage返回的对象

返回值

返回一个对象，包括：

• refs: StorageRefs<T>
• resetters: StorageResetters<T>
• checkers: StorageCheckers<T>

type StorageReactions<T> = {
  refs: StorageRefs<T>;
  resetters: StorageResetters<T>;
  checkers: StorageCheckers<T>;
};

示例

import { storage } from './storage';
const {
  refs: { token },
  resetters: { resetToken },
  checkers: { containsToken },
} = useStorage(storage);

useStorageHelper()

获取存储模块助手的实例

类型

function useStorageHelper<T>(storage: SoftStorage<T>): StorageHelper;

返回值

type StorageHelper = {
  contains: (key: string) => boolean;
  size: () => number;
  initialize: () => void;
};

示例

import { storage } from './storage';
const storageHelper = useStorageHelper(storage);