ant design pro解决初始加载,有顺序的请求/请求顺序报错问题/登录后再加载其他数据/异步的顺序问题/偷跑
方法是:如在Authorized.jsx中解决,当未登录成功(包括登录失败和登录验证中),就显示loading,否则继续 加载渲染children
一个三目运算或者if分支就可以解决,但是要写到最先加载的路由页面中,这样一开始加载页面时,才能拦住其他的组件的加载,例如:我的项目一开始就加载鉴权组件Authorized,那么
Authorized.jsx
render() {
if (loading || loginCode === 100) {
return <PageLoading />;
}
if (loginCode === 400) {
return <Redirect to={`/login`}></Redirect>;
}
return children;
}
loginCode 是我根据后台返回的数据,做的判断,当后台未返回时,loginCode 赋值 100,登录失败时,loginCode 赋值 400 ,登录成功,loginCode 赋值 200即可,此时把用户数据存在redux中,其他页面加载时,都可以用得到,这样,我就有效避免由于网络问题,服务未及时返回,而页面先加载取用户数据报错的问题
ant design pro解决初始加载,有顺序的请求/请求顺序报错问题/登录后再加载其他数据/异步的顺序问题/偷跑的更多相关文章
- ant design pro v2 关于用户登录有多个权限的解决方法
ant design pro V2菜单栏显示流程, 用户输入用户名,密码,登录调用登录接口,校验后返回该用户的权限字段currentAuthority,然后通过调用setAuthority(curre ...
- ant design pro (六)样式
一.概述 参看地址:https://pro.ant.design/docs/style-cn 基础的 CSS 知识或查阅属性,可以参考 MDN文档. 二.详细介绍 2.1.less Ant Desig ...
- Ant Design Pro+Electron+electron-builder实现React应用脱离浏览器,桌面安装运行
ant-design-pro ----> version :2.3.1 由于网上Ant Design Pro+Electron的资料太少,我就贡献一点经验 最近需要讲AntD Pro项目(以 ...
- 轻松玩转Ant Design Pro一
ant design pro来源于ant design,其是一段自带样式的react组件,用于企业后台的漂亮的,可控的组件.ant design有很多组件和样式,不可能所有都记住,我们只要记住常用的, ...
- 测试平台系列(5) 引入Ant Design Pro
引入Ant Design Pro 回顾 还是继续回顾下之前的作业, 返回的中文变成了ascii字符,不要紧,我们光荣地百度一哈. 随便点进去看看,都可以找到正确答案: 可以看到,我们需要修改confi ...
- 阿里开源项目之Ant Design Pro
本篇文章主要包含的内容有三个方面. 第一.Ant Design Pro简介; 第二.Ant Design Pro能做什么; 第三.初步使用; 我相信通过这三个方面的讲解能让你大概知道Ant Desig ...
- ant design pro (十五)advanced 使用 API 文档工具
一.概述 原文地址:https://pro.ant.design/docs/api-doc-cn 在日常开发中,往往是前后端分离的,这个时候约定好一套接口标准,前后端各自独立开发,就不会被对方的技术难 ...
- ant design pro (十四)advanced 使用 CLI 工具
一.概述 原文地址:https://pro.ant.design/docs/cli-cn 为了更好以及高效的开发效率,我们提供了配套的 ant-design-pro-cli 工具. pro cli 提 ...
- ant design pro (十三)advanced 错误处理
一.概述 原文地址:https://pro.ant.design/docs/error-cn 二.详细 2.1.页面级报错 2.1.1.应用场景 路由直接引导到报错页面,比如你输入的网址没有匹配到任何 ...
随机推荐
- C++ class外的 >> 重载,输入流,重载示例。不应该定义类内的>>重载
#include <iostream> // overloading "operator >> " outside class // >> 应该 ...
- shell 下
一句话来概括shell shell是一个基于Linux内核和应用程序之间的一个解释器 Shell解释器 /bin/sh /bin/bash 目前多用的是bash /sbin/ ...
- IT兄弟连 HTML5教程 HTML5的基本语法 了解Web
HTML也是计算机编程语言,但由于功能简单易用,不涉及业务逻辑,算是编程语言中最简单的了.其实学习HTML这门语言,就是在学习一个个HTML标记的使用,标记的名称和使用不是自定义的,它的功能及用法是已 ...
- pytorch_08_RNN
1.循环神经网络的提出是基于记忆模型的想法,期望网络能够记住前面出现的特征,并依据特征推断后面的结果,而且整体的网络结构不断循环,因而得名循环神经网络. 2.循环神经网络的基本结构特别简单,就是将网络 ...
- Python 十大装 X 语法(二)
Python 是一种代表简单思想的语言,其语法相对简单,很容易上手.不过,如果就此小视 Python 语法的精妙和深邃,那就大错特错了.本文精心筛选了最能展现 Python 语法之精妙的十个知识点,并 ...
- SpringBoot2.0中的事务@Transactional
在SpringBoot2.0中使用使用需要注意的地方. 1. 加@Transactional的方法不能是private和protected修饰,private会直接报编译错误,protected不会报 ...
- 使用Java操作Elasticsearch(Elasticsearch的java api使用)
1.Elasticsearch是基于Lucene开发的一个分布式全文检索框架,向Elasticsearch中存储和从Elasticsearch中查询,格式是json. 索引index,相当于数据库中的 ...
- 由 ToString()和Convert.ToString() 引发的问题
对于久经沙场的程序猿来说,类型转换再熟悉不过了,在代码中我们也会经常用到. 前几天,有个学生问我关于类型转换ToString()和Convert.ToString()的区别,这么常用的东西我竟然支支吾 ...
- github pages与travis ci运作原理
当说到自动部署的时候,我很反感那些一上来就balabala说怎么操作的博文文章,照着别人的做法有样学样,经常会因为与自己项目实际情况不符而出现各种问题. 比如说github和travis,首先应该搞明 ...
- C#如何将DataTable中的列名复制到另一个DataTable
C#如何将DataTable中的列名复制到另一个DataTable? 仅复制列名,不复制列下的数据: var newDt = new DataTable(); newDt = oldDataTable ...