文章目录
关于store2
什么情况下使用store2
用户在填写一个庞大表单时(诸如成本合同),如果在填到一大半之时偶发意外,例如页面被重载了,前功尽弃,已填的内容可能丢失。倘若使用了localStorage 先将所填的数据存在用户本地,待到适宜时机再正式提交。在使用localStorage/sessionStorage 时,并不情愿直接使用浏览器提供的 API。
此外,因 Storage 存储的都是字符串,如果保存的是 JSON 字符串,使用之前需要 parse 一次在所难免。我期望是能通过一个 API 尽量操作完取值和设置值的操作。
此外,在多团队合作的项目中,还应支持命名空间之类的隔离措施,这通常是在同一域名的情况下,团队之间对 localStorage 命名时容易发生冲突,这类风波导致一方的逻辑可能遭到破坏。
当前 store2 (npm:store2)是较为多人使用的一个 Storage 替代品,无论是要简洁的 API ,或者命名空间,都可以实现。
store2的地址
- GitHub地址:https://github.com/nbubna/store
- npm镜像仓库地址:https://www.npmjs.com/package/store2
处理本地存储的JavaScript库
crypt.io
crypt.io使用标准JavaScript加密库实现安全的浏览器存储。使用crypto.io时,有三个存储选项:sessionStorage,localStorage或cookie
let storage = crypto;
let book = { title: ‘JavaScript’, price: 13 };
storage.set(‘book’, book, function(error, results) {
if (error) {
throw error;
}
// Do something
});
storage.get(‘book’, function(error, results) {
if (error) {
throw error;
}
// Do something
});
Vuex unknown action type 报错处理
- 在项目中使用模块开发
- 模块结构,permission.js
- 注册模块
- 对于里面的方法,引用的时候直接下图所示,会出现 unknown action type 的报错
- 正确的写法是,在方法之前加上模块名称
- 另一种不用加模块名称的写法是:模块结构,permission.js
- 引用可以直接使用方法
chrome中安装vue-devtools工具
- 比较好用、快速的一种方式
- 创建一个空文件夹,打开“命令提示符工具”,在空文件夹中执行
npm install vue-devtools
命令
- 安装完成后,进入该文件夹
\devtools\node_modules\vue-devtools\vender
目录下,找到manifest.json文件,修改persistent属性值为true
- 打开谷歌浏览器,“管理扩展程序”,选择“加载已解压的拓展程序”,将 /devtools文件夹添加即可
- 重启浏览器,如果是vue应用程序的话,开发者工具页面会出现“Vue”按钮
- 完成上述步骤就可以开发使用vue-devtools调试应用程序了