浏览器存储

Storage

函数名	描述	类型	参数	返回值
Storage	-	class	-	-
Storage.config	配置	(options:object)=>object	options:{type:类型,expired:过期时间,prefix:前缀}	object
Storage.save	保存	(key: string, value: any, opts:object<options>)=>void	key:标识符,value:保存的值, opts: 配置的参数	-
Storage.get	获取	(key: string, opts:object<options>)=>string	key:标识符, opts: 配置的参数	string
Storage.remove	移除	(key: string, opts:object<options>)=>string	key:标识符, opts: 配置的参数	-
Storage.clear	移除所有	(opts:object<options>)=>void	opts: 配置的参数	-

示例

在控制台查看效果

<template>
  <div>
    <XAction label="保存按钮" type="primary" @click="onSave"> </XAction>
    <XAction label="获取按钮" type="primary" @click="onGet"> </XAction>
    <XAction label="移除按钮" type="primary" @click="onRemove"> </XAction>
    <XAction label="移除所有按钮" type="primary" @click="onClear"> </XAction>
  </div>
</template>

<script setup lang="ts">
  import { XAction } from '@vtj/ui';

  import { Storage } from '@vtj/utils';

  const storage = new Storage({
    type: 'local', // session
    expired: 0,
    prefix: '__VTJ_'
  });

  const onSave = () => {
    storage.save('test', '测试保存');
  };

  const onGet = () => {
    console.log(storage.get('test'));
  };

  const onRemove = () => {
    storage.remove('test');
  };

  const onClear = () => {
    storage.clear();
  };
</script>

<style scoped></style>

Cookies

函数名	描述	类型	参数	返回值
set	设置值	(name:string,value:string,opts:object) => void	name: 键名,value: 保存的值，opts:选项	-
get	获取值	(name:string) => string	name: 键名	string
remove	移除值	(name:string,opts:object) => void	name: 键名,opts:选项	-

opts 选项 object

• expires?: number;
• path?: string;
• domain?: string;
• secure?: boolean;
• sameSite?: string;

示例

在控制台查看效果

<template>
  <div>
    <XAction label="set" type="primary" @click="onCookieSet"> </XAction>
    <XAction label="get" type="primary" @click="onCookieGet"> </XAction>
    <XAction label="remover" type="primary" @click="onCookieRemove"> </XAction>
  </div>
</template>

<script setup lang="ts">
  import { XAction } from '@vtj/ui';
  import { cookie } from '@vtj/utils';

  const onCookieSet = () => {
    cookie.set('cookie-test', 'cookie-test-测试');
  };

  const onCookieGet = () => {
    const getValue = cookie.get('cookie-test');
    console.log('onCookieGet', getValue);
  };

  const onCookieRemove = () => {
    cookie.remove('cookie-test');
  };
</script>

<style scoped></style>