Vue.JS项目中5个经典Vuex插件


Posted in Javascript onNovember 28, 2017

使用 Vuex 来管理 Vue 的状态,有很多好的理由。其中之一就是,通过 Vuex 插件可以非常容易的扩展一些很酷的功能。Vuex 社区中的开发人员已经创建了大量的免费插件供你使用,有许多你能想象的功能,还有一些你可能没有想到的功能。

状态持久化同步标签页、窗口语言本地化管理多个加载状态缓存操作

1. 状态持久化

vuex-persistedstate 使用浏览器的本地存储( local storage )对状态( state )进行持久化。这意味着刷新页面或关闭标签页都不会删除你的数据。

一个很好的例子就是购物车:如果用户不小心关闭了一个标签,他们可以重新打开并回到之前页面的状态。

Vue.JS项目中5个经典Vuex插件

2. 同步标签页、窗口

vuex-shared-mutations 可在不同的标签页之间同步状态。它通过 mutation 将状态储存到本地存储(local storage)来实现。选项卡、窗口中的内容更新时触发储存事件,重新调用 mutation ,从而保持状态同步。

Vue.JS项目中5个经典Vuex插件

3. 语言本地化

vuex-i18n 允许你轻松地用多种语言存储内容。让你的应用切换语言时更容易。

一个很酷的功能是你可以存储带有标记的字符串,比如"Hello {name}, this is your Vue.js app."。所有的翻译版本都会在标记的地方使用相同的字符串。

Vue.JS项目中5个经典Vuex插件

4. 管理多个加载状态

vuex-loading 有助于你管理应用中的多个加载状态。这个插件适用于状态变化频繁且复杂的实时应用程序。

Vue.JS项目中5个经典Vuex插件

5. 缓存操作

vuex-cache 可以缓存 Vuex 的 action。例如,如果你从服务器检索数据,这个插件将在第一次调用该 action 时缓存结果,然后在之后的dispatch中,直接返回缓存的值。必要时清除缓存也很简单。

Vue.JS项目中5个经典Vuex插件

Javascript 相关文章推荐
Add a Picture to a Microsoft Word Document
Jun 15 Javascript
firefox事件处理之自动查找event的函数(用于onclick=foo())
Aug 05 Javascript
Jquery ajax传递复杂参数给WebService的实现代码
Aug 08 Javascript
表单验证的完整应用案例探讨
Mar 29 Javascript
选择复选框按钮置灰否则按钮可用
May 22 Javascript
JavaScript中string对象
Jun 12 Javascript
jQuery ajaxSubmit 实现ajax提交表单局部刷新
Jul 04 Javascript
js设置和获取自定义属性的方法
Oct 20 Javascript
Vue学习笔记进阶篇之vue-router安装及使用方法
Jul 19 Javascript
Vue数据驱动表单渲染,轻松搞定form表单
Jul 19 Javascript
vue3 源码解读之 time slicing的使用方法
Oct 31 Javascript
详解如何使用React Hooks请求数据并渲染
Oct 18 Javascript
Vue实现web分页组件详解
Nov 28 #Javascript
基于vue2实现左滑删除功能
Nov 28 #Javascript
JavaScript生成简单等差数列
Nov 28 #Javascript
微信小程序用户自定义模版用法实例分析
Nov 28 #Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
Nov 28 #Javascript
浅谈vue中慎用style的scoped属性
Nov 28 #Javascript
元素全屏的设置与监听实例
Nov 28 #Javascript
You might like
PHPThumb PHP 图片缩略图库
2012/03/11 PHP
Laravel中间件实现原理详解
2016/10/09 PHP
PHP基于curl后台远程登录正方教务系统的方法
2016/10/14 PHP
PHP连接MySQL数据库操作代码实例解析
2020/07/11 PHP
jquery判断checkbox(复选框)是否被选中的代码
2010/10/20 Javascript
jQuery编写widget的一些技巧分享
2010/10/28 Javascript
js报错 Object doesn't support this property or method的原因分析
2011/03/31 Javascript
JavaScript中九种常用排序算法
2014/09/02 Javascript
Js与Jq 获取页面元素值的方法和差异对比
2015/04/30 Javascript
JavaScript中使用指数方法Math.exp()的简介
2015/06/15 Javascript
理解javascript中的原型和原型链
2015/07/30 Javascript
使用jQuery mobile库检测url绝对地址和相对地址的方法
2015/12/04 Javascript
javascript Promise简单学习使用方法小结
2016/05/17 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
2016/11/23 Javascript
jQuery实现可移动选项的左右下拉列表示例
2016/12/26 Javascript
bootstrap下拉菜单使用方法解析
2017/01/13 Javascript
jQuery EasyUI Accordion可伸缩面板组件使用详解
2017/02/28 Javascript
js放到head中失效的原因与解决方法
2017/03/07 Javascript
第一次记录Bootstrap table学习笔记(1)
2017/05/18 Javascript
jq.ajax+php+mysql实现关键字模糊查询(示例讲解)
2018/01/02 Javascript
基于JavaScript实现抽奖系统
2018/01/16 Javascript
Angularjs Ng_repeat中实现复选框选中并显示不同的样式方法
2018/09/12 Javascript
在Vant的基础上封装下拉日期控件的代码示例
2018/12/05 Javascript
微信小程序云开发(数据库)详解
2019/05/17 Javascript
在Python程序中进行文件读取和写入操作的教程
2015/04/28 Python
Python实现的多项式拟合功能示例【基于matplotlib】
2018/05/15 Python
基于pip install django失败时的解决方法
2018/06/12 Python
python中计算一个列表中连续相同的元素个数方法
2018/06/29 Python
Win8下python3.5.1安装教程
2020/07/29 Python
深入解析Python小白学习【操作列表】
2019/03/23 Python
python模块和包的应用BASE_PATH使用解析
2019/12/14 Python
python如何实现复制目录到指定目录
2020/02/13 Python
阻止移动设备(手机、pad)浏览器双击放大网页的方法
2014/06/03 HTML / CSS
2014年大学班级工作总结
2014/11/14 职场文书
品质保证书格式
2015/02/28 职场文书
2015教师节通讯稿
2015/07/20 职场文书