React路由器在路由改变时创建两个完全相同的组件，如何在两个路由上重用相同的组件？

在React中，可以使用React Router来实现路由功能。当需要在两个路由上重用相同的组件时，可以使用React Router提供的一些技术和组件来实现。

一种常见的方法是使用<Route>组件的component属性来指定要渲染的组件。例如，假设有两个路由/route1和/route2，并且希望在这两个路由上重用相同的组件MyComponent，可以这样定义路由：

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

function App() {
  return (
    <Router>
      <Route path="/route1" component={MyComponent} />
      <Route path="/route2" component={MyComponent} />
    </Router>
  );
}

这样，当访问/route1或/route2时，都会渲染MyComponent组件。

另一种方法是使用<Route>组件的render属性，通过一个函数返回要渲染的组件。这样可以更灵活地控制组件的渲染逻辑。例如：

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

function App() {
  return (
    <Router>
      <Route path="/route1" render={() => <MyComponent />} />
      <Route path="/route2" render={() => <MyComponent />} />
    </Router>
  );
}

除了以上两种方法，还可以使用<Switch>组件来包裹多个路由，并且只渲染第一个匹配的路由。这样可以避免重复渲染相同的组件。例如：

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

function App() {
  return (
    <Router>
      <Switch>
        <Route path="/route1" component={MyComponent} />
        <Route path="/route2" component={MyComponent} />
      </Switch>
    </Router>
  );
}

以上是在React中如何在两个路由上重用相同的组件的方法。这些方法都是使用React Router提供的组件和属性来实现的，可以根据具体的需求选择适合的方法来重用组件。

关于React Router的更多信息和用法，可以参考腾讯云的相关产品和文档：