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

 更新时间:2019年11月13日 08:49:07   作者:陈小穗子呀  
今天小编大家分享一篇解决vuex数据异步造成初始化的时候没值报错问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

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

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

state

mutation

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

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

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

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

或者:

3.使用拓展运算符

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

相关文章

  • Vue中axios的基本用法详解

    Vue中axios的基本用法详解

    axios 是一个基于promise用于浏览器和 nodejs 的 HTTP 客户端,这篇文章主要介绍了Vue中axios的基本用法及axios的特征和使用注意细节,本文通过示例代码给大家介绍的非常详细,需要的朋友可以参考下
    2022-07-07
  • 详解vue-validator(vue验证器)

    详解vue-validator(vue验证器)

    本篇文章主要介绍了vue-validator(vue验证器),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-01-01
  • Vue+echart 展示后端获取的数据实现

    Vue+echart 展示后端获取的数据实现

    本文主要介绍了Vue+echart 展示后端获取的数据,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-01-01
  • 使用vue2实现带地区编号和名称的省市县三级联动效果

    使用vue2实现带地区编号和名称的省市县三级联动效果

    我们知道省市区县都有名称和对应的数字唯一编号,使用编号可以更方便查询以及程序处理,我们今天来了解一下使用vue2来实现常见的省市区下拉联动选择效果,需要的朋友可以参考下
    2018-11-11
  • Vue中的事件绑定与解绑方式

    Vue中的事件绑定与解绑方式

    这篇文章主要介绍了Vue中的事件绑定与解绑方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • vue 解决IOS10低版本白屏的问题

    vue 解决IOS10低版本白屏的问题

    这篇文章主要介绍了vue 解决IOS10低版本白屏的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • 浅谈vue的踩坑路

    浅谈vue的踩坑路

    下面小编就为大家带来一篇浅谈vue的踩坑路。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • 浅析vue3响应式数据与watch属性

    浅析vue3响应式数据与watch属性

    这篇文章主要介绍了vue3响应式数据与watch属性的相关知识,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-05-05
  • vue项目百度地图如何自定义标注marker

    vue项目百度地图如何自定义标注marker

    这篇文章主要介绍了vue项目百度地图如何自定义标注marker问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-03-03
  • vue中form表单禁用专用组件介绍

    vue中form表单禁用专用组件介绍

    这篇文章主要介绍了vue中form表单禁用专用组件,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-01-01

最新评论