vue3+typescript插件vue-ls的使用
vue3+typescript中vue-ls使用
·
1、在全局描述文件shims-vue.d.ts 或者是index.d.ts中声明
declare module "vue-ls" {
import storage from "vue-ls"
export default storage
}
2、在main.ts中初始化
import VueStoragePlugin from 'vue-ls';
// console.log(VueStorage)
const WebStorage = VueStoragePlugin.useStorage({
namespace: 'pro__',
name: 'ls',
storage: 'local',
})
WebStorage就是原本的vue-ls了
3、在vue3中使用的话,可以添加到全局属性中
app.config.globalProperties.WebStorage = WebStorage
4、在组件中引入使用
import { getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
const WebStorage = proxy.WebStorage
5、我个人是挂载到window上使用的
window.WebStorage = WebStorage
6、挂载到window需要在全局声明文件声明window属性(在全局描述文件shims-vue.d.ts 或者是index.d.ts中声明)
declare interface Window {
WebStorage:any,
localStorageL:any,
}
7、为什么用这个插件,主要有一个过期时间,不用自己写过期逻辑,如果不使用的话也可以根据这一个插件的大概,自己写一个带过期的方法
更多推荐
已为社区贡献1条内容
所有评论(0)