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 相关文章推荐
弹出广告特效代码(一个IP只弹出一次)
May 11 Javascript
jquery $(document).ready() 与window.onload的区别
Dec 28 Javascript
一个css与js结合的下拉菜单支持主流浏览器
Oct 08 Javascript
详解JS中定时器setInterval和setTImeout的this指向问题
Jan 06 Javascript
Angular 4 依赖注入学习教程之FactoryProvider的使用(四)
Jun 04 Javascript
浅谈gulp创建完整的项目流程
Dec 20 Javascript
基于Vuex无法观察到值变化的解决方法
Mar 01 Javascript
Javascript中弹窗confirm与prompt的区别
Oct 26 Javascript
elementUI select组件value值注意事项详解
May 29 Javascript
layui加载表格,绑定新增,编辑删除,查看按钮事件的例子
Sep 06 Javascript
JQuery 实现文件下载的常用方法分析
Oct 29 jQuery
vue实现可拖拽的dialog弹框
May 13 Vue.js
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
php汉字转拼音的示例
2014/02/27 PHP
destoon利用Rewrite规则设置网站安全
2014/06/21 PHP
PHP的mysqli_query参数MYSQLI_STORE_RESULT和MYSQLI_USE_RESULT的区别
2014/09/29 PHP
PHP读取目录树的实现方法分析
2019/03/22 PHP
100个不能错过的实用JS自定义函数
2014/03/05 Javascript
使用Javascript实现选择下拉菜单互移并排序
2016/02/23 Javascript
购物车前端开发(jQuery和bootstrap3)
2016/08/27 Javascript
jQuery插件HighCharts绘制2D柱状图、折线图的组合双轴图效果示例【附demo源码下载】
2017/03/09 Javascript
vue 文件目录结构详解
2017/11/24 Javascript
利用JQUERY实现多个AJAX请求等待的实例
2017/12/14 jQuery
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
基于JS实现带动画效果的流程进度条
2018/06/01 Javascript
使用vue-router beforEach实现判断用户登录跳转路由筛选功能
2018/06/25 Javascript
webpack优化之代码分割与公共代码提取详解
2019/11/22 Javascript
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
2020/07/27 Javascript
python pandas库的安装和创建
2019/01/10 Python
pandas基于时间序列的固定时间间隔求均值的方法
2019/07/04 Python
Python urllib2运行过程原理解析
2020/06/04 Python
pyCharm 实现关闭代码检查
2020/06/09 Python
Python自带的IDE在哪里
2020/07/01 Python
Pycharm 设置默认解释器路径和编码格式的操作
2021/02/05 Python
CSS3实现的闪烁跳跃进度条示例(附源码)
2013/08/19 HTML / CSS
什么是smarty? Smarty的优点是什么?
2013/08/11 面试题
计算 s=(x*y)1/2,用两个宏定义来实现
2016/08/11 面试题
房地产管理毕业生自荐信
2013/11/04 职场文书
外贸业务员求职信
2014/06/16 职场文书
财务部副经理岗位职责范本
2014/06/17 职场文书
六年级学生期末评语
2014/12/26 职场文书
教师党员个人自我评价
2015/03/04 职场文书
单位工资证明范本
2015/06/12 职场文书
优秀创业计划书分享
2019/07/19 职场文书
让文件路径提取变得更简单的Python Path库
2021/05/27 Python
python之django路由和视图案例教程
2021/07/26 Python
python字典进行运算原理及实例分享
2021/08/02 Python
漫画「你在春天醒来」第10卷封面公开
2022/03/21 日漫
JavaScript实现一键复制内容剪贴板
2022/07/23 Javascript