Reactjs 如何在react router 4中向URL添加哈希

我想在react router中向我的内点添加哈希，以防止来自服务器的错误响应。我正在使用

python-msimplehttpserver-p8888

创建服务器

这个简短的例子很管用，但当我尝试在一些路径上重新加载页面时，比如

/about

，我得到一个错误：

错误响应错误代码404。消息：找不到文件。错误代码说明：404=没有与给定URI匹配的内容。

import { BrowserRouter as Router, Route, Link, Switch } from "react-router-dom";

const Routes = () => (
    <Router>
        <div>
            <ul>
                <li><Link to="/about">About Link</Link></li>
                <li><Link to="/company">Company Link</Link></li>
            </ul>
            <Switch>
                <Route path="/about" component={About} />
                <Route path="/company" component={Company} />
            </Switch>
        </div>
    </Router>
);

class App extends React.Component {
    render() {
        return (
                <Routes />          
        );
    }
}

从“react Router dom”导入{BrowserRouter as Router，Route，Link，Switch}；
常数路由=（）=>(

关于链接
公司链接

);
类应用程序扩展了React.Component{
render（）{
返回(
);
}
}

有两种解决方法：

1） 让您的web服务器始终使用相同的

index.html

文件响应，而不管路径如何。这将防止404错误，但并不完美，因为它不支持浏览器缓存

---

2） 使用-它将在URL的哈希部分保留UI路由，这不应使服务器返回404，并将启用浏览器端缓存。这种方法的缺点是不能使用指向网页特定部分的目标链接

我没有仔细查看文档，下面是解决方案：

const Routes = () => (
    <HashRouter basename="/#">
        <div>
            <ul>
                <li><Link to="/about">About Link</Link></li>
                <li><Link to="/company">Company Link</Link></li>
            </ul>
            <Switch>
                <Route path="/about" component={About} />
                <Route path="/company" component={Company} />
            </Switch>
        </div>
    </HashRouter>
);

const Routes=（）=>(

关于链接
公司链接

);

谢谢，我错过了关于HashRouter的这部分文档。这种方法的缺点是，你不能使用指向网页特定部分的目标链接，这是绝对正确的，但如果它不是一个博客或类似的东西，那么我认为这并不重要。谢谢Kuba！第二种方法：我知道它不漂亮，但是你不能将散列字符串与查询参数混合使用，并将其作为你的目标吗？假设…/page？linkTarget=contact formI通常使用查询参数而不是哈希位置，并尝试使用一个非常小且快速加载的index.html来适应缺少cache@KubaOrlik我对你的第一个解决方案感兴趣。有没有人可以演示如何使用go服务器（特别是使用packr）来实现这一点。但是应该提供所有其他现有资产，如图像或css文件，以及

index.html

。提前感谢！