SPA项目中,404页面 和 登陆页面 对应的路由,应该怎样控制?
- SPA项目中,404页面 和 登陆页面 对应的路由,应该怎样控制?
可以这样做:
- 登陆之前,所有页面跳到 登陆页面;包括随便输入的路由地址。
- 登陆后,跳到相应页面;随便输入的、不存在的路由地址,才跳到404页面。
- react项目代码示例:
- 路由是login或其他:
https://github.com/cag2050/react_eject_antd_demo/blob/master/src/index.js
switch 是只能选择一个
<Switch>
<Route exact path='/login' component={Login}/>
<Route component={App}/>
</Switch>
- 路由是要进入的页面或找不到:
https://github.com/cag2050/react_eject_antd_demo/blob/master/src/components/MyLayout.js
switch 是只能选择一个
<Switch>
{router.map((route, i) => <PrivateRoute key={i} exact={!!route.exact} path={route.path} component={route.component}/>)}
<PrivateRoute component={NotFound}/>
</Switch>
SPA项目中,404页面 和 登陆页面 对应的路由,应该怎样控制?的更多相关文章
- VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题
VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题:https://blog.csdn.net/jerrica/article/d ...
- 小KING教你做android项目(二)---实现登陆页面并跳转和简单的注册页面
原文:http://blog.csdn.net/jkingcl/article/details/10989773 今天我们主要来介绍登陆页面的实现,主要讲解的就是涉及到的布局,以及简单的跳 ...
- spring项目中web-inf下不能引用页面资源
1.spring项目结构 2.spring结构说明 web-inf目录是不对外开放的,外部没办法直接访问到(即通过url访问),只有通过映射来访问,如映射一个action或servlet通过服务器端跳 ...
- VUE项目中使用this.$forceUpdate()强制页面重新渲染
在使用Vue框架开发时,在函数中改变了页面中的某个值,在函数中查看是修改成功了,但在页面中没有及时刷新改变后的值,我是在使用多层v-for嵌套时出现这种问题的, 解决方法:运用 this.$force ...
- 一个Django项目中实现的简单HTML页面布局
1 - 基础页面(被继承的模板) {% load static %} <!DOCTYPE html> <html lang="en"> <head&g ...
- vue2项目中better-scroll 插件使用时候页面不滚动
参考这里 1.外面包裹层的高度没有设置或者条目的高度没有超过外面包裹层的高度 2.初始化BetterScroll的时机不对,当前元素还没有正常渲染出来,导致BetterScroll的高度的计算错误
- create-react-app 搭建的项目中,让 antd 通过侧边栏导航 Menu 的 Menu.Item 控制 Content 部分的变化
第一种:BrowserRouter把Menu和Route组给一起包起来 <Router></Router> 标签要把Menu和Route组给一起包起来 修改src/index. ...
- vu项目中按F5刷新element菜单没有根据路由匹配菜单解决办法
element组件的菜单中设置:default-active,这个是选择哪个菜单的 然后在created里边增加 因为每次刷新都是要经过这个的.注意data里边也要同步.
- vue 项目中当访问路由不存在的时候默认访问404页面
前言: 在Vue项目中,当访问的页面路由不存在或错误时,页面显示为一片空白.然而,通常我们需要对访问url不存在或者错误的情况下添加默认的404页面,即not found页面. 一般的处理方法是: 在 ...
随机推荐
- tf.nn.rnn_cell.MultiRNNCell
Class tf.contrib.rnn.MultiRNNCell 新版 Class tf.nn.rnn_cell.MultiRNNCell 构建多隐层神经网络 __init__(cells, sta ...
- ::selection 选择器
使被选中的文本成为红色:::selection { color:#ff0000; } ::-moz-selection { color:#ff0000; }
- <Web Crawler><Java><thread-safe queue>
Basic Solution The simplest way is to build a web crawler that runs on a single machine with single ...
- Java Editplus编译环境配置
java jdk 安装win10 配置:此电脑--属性--高级系统设置--环境变量--系统变量-->新建--变量名--JAVA_HOME 变量值--浏览目录--jdk安装路径jdk...--&g ...
- 使用Redis做为MySQL的缓存
OS: Ubuntu 16.04.4 x64 更新并安装必要的工具 apt update && apt upgrade -y && apt dist-upgrade - ...
- Arrays.copyOfRange()
Comparable[] aux = Arrays.copyOfRange(arr,from, to); 复制数组arr, from下标开始, to下标结束. 但是不包括to. 所以复制代码为 Com ...
- 前端笔记 (3.JavaScript 2)
一般来说,js代码越来越庞大的时候,最好要把它存在一个js文件中, 通过src引入即可,这样具有维护性高,可缓存(加载一次,无需加载) 方便未来拓展的特性 正确写法: <script type= ...
- 【转】Principles of training multi-layer neural network using backpropagation
Principles of training multi-layer neural network using backpropagation http://galaxy.agh.edu.pl/~vl ...
- Android反调试笔记
1)代码执行时间检测 通过取系统时间,检测关键代码执行耗时,检测单步调试,类似函数有:time,gettimeofday,clock_gettime. 也可以直接使用汇编指令RDTSC读取,但测试AR ...
- 数据类型int、float、str、list、dict、set定义及常用方法汇总
数据类型int:记录整数事物状态 可变不可变:值不可变类型,改变变量值实则是改变了变量的指向 int():功能:1.工厂函数, i = 5 <==> i = int(5) 2.强制类型转换 ...