【vue】各种插件的使用（持续更新中）

一、vue-ls

作用：用来控制数据存储在 localStorage 或者 sessionStorage 中，还可以控制其存储时效性

1. 安装

npm install vue-ls --save 
yarn add vue-ls

2. 使用
   全局使用，在 main.js 文件中导入

import Storage from ‘vue-ls’;

const options = {
	namespace: 'vuejs_', //存储的key键前缀，可自定义
	name: 'ls', //命名Vue变量.ls则使用为this.$ls或者Vue.ls
	storage: 'local', //存储名称: session, local, memory，更改为session则默认存储sessionStorage
};

Vue.use(Storage, options); //使用vue-ls插件

3. API 说明

this.$ls.set(name, value, expire)  //在storage设置name的value,并将 value 转化为JSON;expire: 默认为null,name有效时间以毫秒为单位
this.$ls.get(name)  //返回storage中name值
this.$ls.remove(name)  //从storage中移除name,成功移除返回true,否则返回false
this.$ls.on(name, callback)  //持续监听name在其他标签上的更改，更改时触发callback,传递以下参数：（newValue:当前storage中name,从持久化的JSON中解析;oldValue:旧的storage中name,从持久化的JSON中解析;url:修改来自选项卡的URL）
this.$ls.off(name, callback) //删除以前的侦听器this.$ls.on(name, callback)

4. 实例
   设置token时效性并判断token是否过期，从而判断是否需要重新登录进行路由跳转