方法是:如在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解决初始加载,有顺序的请求/请求顺序报错问题/登录后再加载其他数据/异步的顺序问题/偷跑的更多相关文章

  1. ant design pro v2 关于用户登录有多个权限的解决方法

    ant design pro V2菜单栏显示流程, 用户输入用户名,密码,登录调用登录接口,校验后返回该用户的权限字段currentAuthority,然后通过调用setAuthority(curre ...

  2. ant design pro (六)样式

    一.概述 参看地址:https://pro.ant.design/docs/style-cn 基础的 CSS 知识或查阅属性,可以参考 MDN文档. 二.详细介绍 2.1.less Ant Desig ...

  3. Ant Design Pro+Electron+electron-builder实现React应用脱离浏览器,桌面安装运行

    ant-design-pro ----> version :2.3.1 由于网上Ant Design Pro+Electron的资料太少,我就贡献一点经验   最近需要讲AntD Pro项目(以 ...

  4. 轻松玩转Ant Design Pro一

    ant design pro来源于ant design,其是一段自带样式的react组件,用于企业后台的漂亮的,可控的组件.ant design有很多组件和样式,不可能所有都记住,我们只要记住常用的, ...

  5. 测试平台系列(5) 引入Ant Design Pro

    引入Ant Design Pro 回顾 还是继续回顾下之前的作业, 返回的中文变成了ascii字符,不要紧,我们光荣地百度一哈. 随便点进去看看,都可以找到正确答案: 可以看到,我们需要修改confi ...

  6. 阿里开源项目之Ant Design Pro

    本篇文章主要包含的内容有三个方面. 第一.Ant Design Pro简介; 第二.Ant Design Pro能做什么; 第三.初步使用; 我相信通过这三个方面的讲解能让你大概知道Ant Desig ...

  7. ant design pro (十五)advanced 使用 API 文档工具

    一.概述 原文地址:https://pro.ant.design/docs/api-doc-cn 在日常开发中,往往是前后端分离的,这个时候约定好一套接口标准,前后端各自独立开发,就不会被对方的技术难 ...

  8. ant design pro (十四)advanced 使用 CLI 工具

    一.概述 原文地址:https://pro.ant.design/docs/cli-cn 为了更好以及高效的开发效率,我们提供了配套的 ant-design-pro-cli 工具. pro cli 提 ...

  9. ant design pro (十三)advanced 错误处理

    一.概述 原文地址:https://pro.ant.design/docs/error-cn 二.详细 2.1.页面级报错 2.1.1.应用场景 路由直接引导到报错页面,比如你输入的网址没有匹配到任何 ...

随机推荐

  1. LeetCode 1244. 力扣排行榜

    地址 https://www.acwing.com/solution/LeetCode/content/5765/ 题目描述新一轮的「力扣杯」编程大赛即将启动,为了动态显示参赛者的得分数据,需要设计一 ...

  2. python爬虫之爬取网站到数据库

    一.根据已有程序运行得到的结果 完整代码如下: import sqlite3; class DB(object): """数据库访问方法的实现""&q ...

  3. LeetCode解题笔记 - 3. Longest Substring Without Repeating Characters

    Given a string, find the length of the longest substring without repeating characters. Examples: Giv ...

  4. 《Effective-Ruby》读书笔记

    本篇是在我接触了 Ruby 很短一段时间后有幸捧起的一本书,下面结合自己的一些思考,来输出一下自己的读书笔记 前言 学习一门新的编程语言通常需要经过两个阶段: 第一个阶段是学习这门编程语言的语法和结构 ...

  5. 配置vtk(Win8.1 + VS2012+VTK-5.10.1)

    1.下载相关软件 vtk-5.10.1.zip和vtkdata-5.10.1.zip http://www.vtk.org/files/release/5.10/vtk-5.10.1.zip http ...

  6. pyEcharts安装及使用指南(最新)

    pyEcharts安装及使用指南(最新): 网上资料大多数是0.5X的版本, 这里我给出我的0.5版本连接https://www.cnblogs.com/dgwblog/p/11811562.html ...

  7. javascript 模块化 (切记:学习思想)

    模块化(切记:学习思想) 如果不用模块化编写代码,那么会具有以下问题: 代码杂乱无章,没有条理性,不便于维护,不便于复用 很多代码重复.逻辑重复 全局变量污染 不方便保护私有数据(闭包) 模块化的基本 ...

  8. JVM GC系列 — GC算法

    一.前言 从本篇文章开始,将开始一个新的系列JVM.JVM是一个非常庞大且复制的技术体系,但是对于程序猿的升级,走向更高阶所必要经历的,曾经也下决心要好好学习一番,然而毅力不足都中途放弃. GC的作用 ...

  9. C#面对对象之封装、继承、多态的简单理解

    一.封装 隐藏对象的属性和实现细节,仅对外公开接口,控制在程序中属性的读取和修改的访问级别. 简单来多,就是讲我们所需要的代码打包封装进入一个类里面,便于我们调用,操作.这就是封装. 这样就隔离了具体 ...

  10. c# 字符串中全角和半角字符互转

    public class ConvertDBCAndSBC { /// <summary>半角转成全角 /// 半角空格32,全角空格12288 /// 其他字符半角33~126,其他字符 ...