最近在做项目的时候遇到了如下错误



并在控制台看到了如下的报错



我先是按照控制台的错误搜索,得出的结果都是对meta头部进行设置,允许资源请求,但是问题依然没有解决,偶然间改变了想法,会不会是路由的问题呢,一搜还真是,这是因为没有历史记录

添加HashRouter即可

import { HashRouter } from 'react-router-dom';

  <HashRouter>
{/*<Route>*/}
<Route exact path="/" component={ App } /> <Route path="/aboutMe" component={aboutMe} />
<Route path="/myBlog" component={myBlog} />
<Route path="/myTrip" component={myTrip} />
<Route path="/aboutWebsite" component={aboutWebsite}/> {/*</Route>*/}
</HashRouter>



最终url会被打上#,问题解决,说是因为打上#后不再会请求服务器资源

问题参考:https://stackoverflow.com/questions/27928372/react-router-urls-dont-work-when-refreshing-or-writing-manually

react-router刷新页面Cannot GET 问题的更多相关文章

  1. React Router v4 页面传值的三种方法

    传值方法 1.props.params 使用React router定义路由时,我们可以给指定一个path,然后指定通配符可以携带参数到指定的path: <Route path='/user/: ...

  2. React+React Router+React-Transition-Group实现页面左右滑动+滚动位置记忆

    2018年12月17日更新: 修复在qq浏览器下执行pop跳转时页面错位问题 本文的代码已封装为npm包发布:react-slide-animation-router 在React Router中,想 ...

  3. react 打包后,项目部署完毕,刷新页面报错(404)

    原因解析: 之所以你在浏览器内可以由首页跳转到其他路由地址,是因为这是由前端自行渲染的,你在React Router定义了对应的路由,脚本并没有刷新网页访问后台,是JS动态更改了location. 当 ...

  4. React Router 4.x 开发,这些雷区我们都帮你踩过了

    前言 在前端框架层出不穷的今天,React 以其虚拟 DOM .组件化开发思想等特性迅速占据了主流位置,成为前端开发工程师热衷的 Javascript 库.作为 React 体系中的重要组成部分:Re ...

  5. React Router教程

    React Router教程 React项目的可用的路由库是React-Router,当然这也是官方支持的.它也分为: react-router 核心组件 react-router-dom 应用于浏览 ...

  6. React Router API文档

    React Router API文档 一.<BrowserRouter> 使用HTML5历史记录API(pushState,replaceState和popstate事件)的<Rou ...

  7. React Router 用法

    React Router 用法 一.DEMO import React from "react"; import { HashRouter as Router, Route, Li ...

  8. React Router学习

    React Router教程 本教程引用马伦老师的的教程 React项目的可用的路由库是React-Router,当然这也是官方支持的.它也分为: react-router 核心组件 react-ro ...

  9. React:快速上手(6)——掌握React Router

    React:快速上手(6)——掌握React Router 引入Router 安装 npm install react-router-dom 基础组件 React Router中有三种类型的组件:路由 ...

  10. react router路由传参

    今天,我们要讨论的是react router中Link传值的三种表现形式.分别为通过通配符传参.query传参和state传参. ps:进入正题前,先说明一下,以下的所有内容都是在react-rout ...

随机推荐

  1. 普通莫队--洛谷P1997 【faebdc的烦恼】

    离散化+莫队 cnt数组表示某个颜色出现的次数 sum数组表示某个数量出现的颜色种类 其它细节问题就按照莫队的模板来的 #include<cstdio> #include<algor ...

  2. mininet(一)实验环境搭建

    mininet(一)实验环境搭建 mininet(二)简单的路由实验 mininet(三)简单的NAT实验 最近学习(https://github.com/mininet/openflow-tutor ...

  3. Openfiler存储搭建

    说明: Openfiler是一个基于Linux的开源免费网络存储管理操作系统,通过WEB界面对存储磁盘进行管理,支持iSCSI.NFS 等网络存储协议. 目前最新版本:openfileresa-2.9 ...

  4. C语言之推箱子游戏代码

    前言本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:Yan_Less 正文 新手注意:如果你学习遇到问题找不到人解答,可以点 ...

  5. 新版FPC摄像头测评 OV7725 OV7670 OV9650 OV9655 OV5640 OV5642 OV2640 OV3640 MT9D112

    新版FPC摄像头测评 OV7725 OV7670 OV9650 OV9655 OV5640 OV5642 OV2640 OV3640 MT9D112 最新制样新版FPC摄像头板卡,先看看结构尺寸 再瞧 ...

  6. 深入理解 Java 方法

    方法(有的人喜欢叫函数)是一段可重用的代码段.

  7. 开发 Laravel 扩展的基本流程

    创建一个空的laravel项目 composer create-project --prefer-dist laravel/laravel pkg 在新建的 laravel 项目中建立如下目录 qia ...

  8. flash插件

    偶尔见到别人的博客侧边栏 有一些很有意思的flash插件,也想加入到自己博客里面,这里来大概讲一下~ 一.支持js代码 首先要在  博客设置 >开启博客侧边栏公告的js代码支持,提交审核后 很快 ...

  9. spf13-vim安装成功

    之前安装好像都没有出现这个画面,说明我安装得不完整吧!有一个html括号匹配的插件要求输入username和password,不知所以然,没安装上,其他应该一切正常.纪念一个!

  10. HttpRunner学习8--使用debugtalk.py辅助函数

    前言 在HttpRunner中,我们的测试用例都是写在 YAML/JSON 文件中,有时候我们想借助代码来实现某些较复杂的功能,但在 YAML/JSON 中是无法直接写代码来处理的,这个时候,我们可以 ...