解决vuex数据异步造成初始化的时候没值报错问题


Posted in Javascript onNovember 13, 2019

当使用vue做登录的时候,我们会把拿到的部分用户信息存在vuex+cookie中,我们知道,vuex的数据是会随着浏览器刷新而丢失的,此时我们会重新请求接口对vuex的数据进行再次赋值,如下

当有cookie但是vuex没有数据的时候再次请求赋值

解决vuex数据异步造成初始化的时候没值报错问题

state

解决vuex数据异步造成初始化的时候没值报错问题

mutation

解决vuex数据异步造成初始化的时候没值报错问题

vuex的数据是异步的,当我们页面需要直接拿vuex的值进行渲染的时候,初始化瞬间(即请求过程进行的时候),vuex是没有这个值的,如何解决这个问题,暂时总结了三种方法,希望有遇到的大佬进行补充和查错:

1.通过watch和mouted监听并且初始化vuex数据

在mounted的时候初始化该数据 并且watch该数据(不推荐)

2.在computed赋值该数据 并且在dom渲染的时候做非空的判断

解决vuex数据异步造成初始化的时候没值报错问题

解决vuex数据异步造成初始化的时候没值报错问题

或者:

解决vuex数据异步造成初始化的时候没值报错问题

解决vuex数据异步造成初始化的时候没值报错问题

3.使用拓展运算符

解决vuex数据异步造成初始化的时候没值报错问题

以上这篇解决vuex数据异步造成初始化的时候没值报错问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascipt匹配单行和多行注释的正则表达式
Nov 20 Javascript
JS小功能(offsetLeft实现图片滚动效果)实例代码
Nov 28 Javascript
原生js和jquery中有关透明度设置的相关问题
Jan 08 Javascript
微信小程序 wx.uploadFile无法上传解决办法
Dec 14 Javascript
Bootstrap CSS布局之按钮
Dec 17 Javascript
微信小程序 合法域名校验出错详解及解决办法
Mar 09 Javascript
Angular2之二级路由详解
Aug 31 Javascript
Vue实现调节窗口大小时触发事件动态调节更新组件尺寸的方法
Sep 15 Javascript
通过JS深度判断两个对象字段相同
Jun 14 Javascript
简单了解Vue + ElementUI后台管理模板
Apr 07 Javascript
详解element-ui动态限定的日期范围选择器代码片段
Jul 03 Javascript
基于JavaScript实现简单抽奖功能代码实例
Oct 20 Javascript
前端vue-cli项目中使用img图片和background背景图的几种方法
Nov 13 #Javascript
基于vue-cli3和element实现登陆页面
Nov 13 #Javascript
vue data引入本地图片的两种方式小结
Nov 13 #Javascript
vue中的 $slot 获取插槽的节点实例
Nov 12 #Javascript
解决vue v-for src 图片路径问题 404
Nov 12 #Javascript
vue 项目打包时样式及背景图片路径找不到的解决方式
Nov 12 #Javascript
vue+webpack dev本地调试全局样式引用失效的解决方案
Nov 12 #Javascript
You might like
CI框架常用方法小结
2016/05/17 PHP
php解析base64数据生成图片的方法
2016/12/06 PHP
PHP的mysqli_ssl_set()函数讲解
2019/01/23 PHP
一些相见恨晚的 JavaScript 技巧
2010/04/25 Javascript
jquery ready函数、css函数及text()使用示例
2013/09/27 Javascript
JavaScript表格常用操作方法汇总
2015/04/15 Javascript
jQuery实现将页面上HTML标签换成另外标签的方法
2015/06/09 Javascript
JavaScript实现select添加option
2015/07/03 Javascript
Javascript类型转换的规则实例解析
2016/02/23 Javascript
Bootstrap Table从零开始
2017/06/30 Javascript
Three.js加载外部模型的教程详解
2017/11/10 Javascript
解决vue页面刷新或者后退参数丢失的问题
2018/03/13 Javascript
vue修改对象的属性值后页面不重新渲染的实例
2018/08/09 Javascript
vue+axios 前端实现的常用拦截的代码示例
2018/08/23 Javascript
从零使用TypeScript开发项目打包发布到npm
2020/02/14 Javascript
javascript canvas检测小球碰撞
2020/04/17 Javascript
三剑客:offset、client和scroll还傻傻分不清?
2020/12/04 Javascript
python通过线程实现定时器timer的方法
2015/03/16 Python
Python中用memcached来减少数据库查询次数的教程
2015/04/07 Python
Python语言的面相对象编程方式初步学习
2016/03/12 Python
Python函数中的函数(闭包)用法实例
2016/03/15 Python
解析Python中的__getitem__专有方法
2016/06/27 Python
Python连接PostgreSQL数据库的方法
2016/11/28 Python
Python scikit-learn 做线性回归的示例代码
2017/11/01 Python
利用Hyperic调用Python实现进程守护
2018/01/02 Python
python机器人行走步数问题的解决
2018/01/29 Python
浅谈python3发送post请求参数为空的情况
2018/12/28 Python
pytorch 计算Parameter和FLOP的操作
2021/03/04 Python
HTML5 Canvas像素处理使用接口介绍
2012/12/02 HTML / CSS
墨西哥皇宫度假村预订:Palace Resorts
2018/06/16 全球购物
如何写你的创业计划书
2014/01/07 职场文书
我们的节日清明节活动总结
2014/04/30 职场文书
党员教师四风自我剖析材料
2014/09/30 职场文书
新党章的学习心得体会
2014/11/07 职场文书
学校德育工作总结2015
2015/05/11 职场文书
永远是春天观后感
2015/06/12 职场文书