vue localStorage本地缓存具体使用方法

vue（localStorage本地缓存具体使用方法）vue.local.storage用法（注意：上图为大体框图结构，详情见下文）1.在vue项目中，创建一个名为storage.js的file2.在上述创建file中编写如下图代码3.在vue项目main.js文件中编写如图代码4.在某一需要本地缓存数据的页面编写如下图代码(注：template标签中内容）（注:sc...

粉红味儿的皮卡猪

5391人浏览 · 2020-01-09 11:07:17

粉红味儿的皮卡猪 · 2020-01-09 11:07:17 发布

vue（localStorage本地缓存具体使用方法）vue.local.storage用法

大体概念框架

（注意：上图为大体框图结构，详情见下文）

1.在vue项目中，创建一个名为storage.js的file

2.在上述创建file中编写如下图代码

storage.js中代码段

3.在vue项目main.js文件中编写如图代码

main.js中代码段

4.在某一需要本地缓存数据的页面编写如下图代码

(注：template标签中内容）

在这里插入图片描述

（注:scrpit标签中内容)

在这里插入图片描述

（注1：在data中定义数据）

定义设置，控制台打印以及移除数据函数/方法

（注2：在methods中定义设置，控制台打印以及移除数据函数/方法）

5.在某一另外需要获取本地缓存数据的页面编写如下代码段

（注：template标签中内容）

在这里插入图片描述

（注:scrpit标签中内容）

在这里插入图片描述（注解：上述本地缓存的数据为userInfo.userName）

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^