React-router-dom错误：‘您不应在<Router>`外部使用<Route>或withRouter()

React-router-dom是React官方提供的用于构建单页面应用的路由库。它提供了一组组件，用于管理应用程序的不同页面之间的导航和路由。

针对您提到的错误信息：‘您不应在<Router>`外部使用<Route>或withRouter()’，这个错误通常是由于在<Router>组件的外部使用了<Route>或withRouter()导致的。

解决这个错误的方法是将<Route>或withRouter()组件放置在<Router>组件的内部。这是因为<Route>和withRouter()需要访问<Router>提供的路由信息和历史记录对象。

下面是一个示例代码，展示了如何正确使用React-router-dom：

import React from 'react';
import { BrowserRouter as Router, Route, withRouter } from 'react-router-dom';

// 定义组件
const Home = () => <h1>Home</h1>;
const About = () => <h1>About</h1>;

// 使用withRouter()包装组件，以便在组件内部可以访问路由信息
const Navigation = withRouter(({ history }) => (
  <div>
    <button onClick={() => history.push('/')}>Home</button>
    <button onClick={() => history.push('/about')}>About</button>
  </div>
));

// 在Router组件内部使用Route和Navigation组件
const App = () => (
  <Router>
    <Navigation />
    <Route exact path="/" component={Home} />
    <Route path="/about" component={About} />
  </Router>
);

export default App;

在上面的示例中，我们将<Route>和withRouter()组件放置在<Router>组件的内部。同时，我们使用withRouter()包装了Navigation组件，以便在组件内部可以访问路由信息。

这样，我们就可以正确地使用React-router-dom，并且避免了‘您不应在<Router>`外部使用<Route>或withRouter()’的错误。

推荐的腾讯云相关产品：腾讯云服务器（CVM）、腾讯云对象存储（COS）、腾讯云数据库（TencentDB）等。您可以通过访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于这些产品的详细信息和使用指南。