本文介绍了反应-路由器交换机未按预期工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在学习REACTION,却被困在REACTION-ROUES
考虑以下事项:
import React from "react";
import { BrowserRouter, Route, Switch } from "react-router-dom";
import HelloWorld from "./HelloWorld.jsx";
const Root = () => {
return (
<BrowserRouter>
<div>
<Switch>
<Route path="/" exact component={HelloWorld} />
<Route component={NoMatch} />
</Switch>
</div>
</BrowserRouter>
);
};
function NoMatch({ location }) {
return (
<div>
<h3>
No match found
</h3>
</div>
);
}
export default Root;
在‘/’此路线上,它按预期呈现HelloWorld
组件,但在其他路线上(例如abc
),它显示Cannot GET /abc
而不是No match found
推荐答案
如果您使用create-react-app
设置Reaction项目,则代码运行正常,但如果您使用webpack配置手动设置项目,则需要devServer: {historyApiFallback: true,}
Reaction路由才能工作。
这篇关于反应-路由器交换机未按预期工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!