lin-storage v1.0.1

说明

lin-storage是仅1.03k的单文件js模块，灵感来源于antfu的@vueuse/core库中的useLocalStorage，因为我在使用时发现了个问题，感兴趣的可以看看issues#1283

你可以将想要保存的数据初始化为一个变量，然后就可以通过这个变量更新和获取值并自动同步localStorage，并且在更新和获取数据时不再需要像localStorage那样关心JSON转换，api设计基本跟localStorage一致，具体见API参考。

快速使用

1､安装

npm install lin-storage

2､使用案例（这里以pinia为例）

import { defineStore } from "pinia"
import { linStorage } from 'lin-storage'
export const useTestStore = defineStore('test', {
    state() {
        return {
            userData: linStorage.init('userData', {}),   //初始化一个object数据
            token: linStorage.init('token', '')     //初始化一个基本类型数据
        }
    },
    actions: {
        changeUserData() {
            //object批量更新
            this.userData.setValue({name: 'lin'})
            this.userData.value = {name: 'lin'}
            //object局部更新（数组暂不支持）
            this.userData.setItem('name','lin')
            this.userData.name = 'lin'
            //基本类型更新
            this.token.setValue('this is token')
            this.token.value = 'this is token'
            //取值
            console.log(this.userData)          //{name: 'lin'}
            console.log(this.userData.name)     //lin
            //基本类型数据通过value获取）
            console.log(this.token.value)       //this is token
            //你也可以直接使用linStorage全局操作所有值
            linStorage.token.setValue('new token')
            linStorage.clear()  //清空所有
        }
    }
})

API参考

1､属性

属性名	类型	说明
length	Number	存储的数据条数
value	---	主要用来取基本类型数据的值；也可以设置值，但其实是调用了setValue方法，结合性能和语义化建议使用setValue

1､方法

方法名	参数	说明	返回值
init	key, value	传入key和defaultValue初始化一项数据；如果key已经存在则初始化默认值无效	被监听后的Proxy实例
getItem	key	获取指定值	指定值
setItem	key, value	设置指定值	指定值
removeItem	key	删除指定值	指定值
clear	---	清空值	---
setValue	value	批量更新值	更新后的值