请用JavaScript代码实现一个react 路由组件

以下是一个使用React和React Router库实现的简单的路由组件示例：

import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Home from './Home';
import About from './About';
import Contact from './Contact';

function App() {
  return (
    <Router>
      <div>
        <Switch>
          <Route exact path="/" component={Home} />
          <Route path="/about" component={About} />
          <Route path="/contact" component={Contact} />
        </Switch>
      </div>
    </Router>
  );
}

export default App;

在这个示例中，我们首先导入了React和React Router库。然后，我们创建一个名为`App`的函数组件，并在其中使用`BrowserRouter`作为Router组件。接下来，我们在`div`元素中包含了一个`Switch`组件，用于渲染路由的内容。在`Switch`组件中，我们使用了三个`Route`组件来指定三个不同的路径，每个路径都对应不同的组件。

例如，当用户访问`/about`路径时，React将会渲染`About`组件。如果用户访问任何未定义的路径，React将渲染`Home`组件，因为我们将`exact`属性传递给了路径为`/`的`Route`组件，使其仅在访问该路径时进行渲染。

请注意，以上代码示例假设我们在应用程序根目录下有名为`Home.js`、`About.js`和`Contact.js`的组件文件，这些文件包含了相应的组件定义。如果这些组件不存在，应用程序将无法正常工作。