Javascript 反应路由器组件不渲染

我一直在使用React Router，并尝试将我的App.js和Car.js组件路由到一起。我在这两个组件中编写了{this.props.children}，但它仍然不起作用。当我部署我的应用程序时，我的本地主机页面上没有显示Car.js组件指示的位置

以下是我的App.js：

import React, { Component } from 'react';
import Login from './Login.js';
import Search from './Search.js';
import Message from './Message.js';
import Car from './Car.js';
import {BrowserRouter, Route} from 'react-router-dom';

export default class App extends React.Component {
  render() {
    return (
      <div>
        <Login />
        <Search />
        <Message />
            <div>
                <BrowserRouter> 
                <Route path="/Car" component={Car}/>
                </BrowserRouter>
                {this.props.children}
            </div>
      </div>

    );
  }
}

import React，{Component}来自'React'；
从“./Login.js”导入登录名；
从“/Search.js”导入搜索；
从“/Message.js”导入消息；
从“./Car.js”导入汽车；
从“react router dom”导入{BrowserRouter，Route}；
导出默认类App扩展React.Component{
render（）{
返回(
{this.props.children}
);
}
}

Car.js：

// Car page example 
import React, { Component } from 'react';
import {Router, Route} from 'react-router';

class Car extends Component {
    render(){
        return(
            <div>
                <h1> Cars page </h1>
                {this.props.children}
            </div>
        );
    }
}

export default Car;

//汽车页面示例
从“React”导入React，{Component}；
从“react Router”导入{Router，Route}；
类汽车扩展组件{
render（）{
返回(
汽车页面
{this.props.children}
);
}
}
出口默认汽车；

所以您至少需要2条路线，除非/Cars是唯一一个不需要路线的页面：）

在本例中，当您的url类似于

http:/www.exmaple.com/

当url为http://www.exmaple.com/Cars

const App = () => (
    <div>
        <Login />
        <Search />
        <Message />
        <div>
            <BrowserRouter>
                // you're going to want a default view
                <Route exact path="/" component={Home} />
                // this will be displayed when your url has /Car at the end of it
                <Route path="/Car" component={Car} />
            </BrowserRouter>
        </div>
    </div>
);

const-App=（）=>(
//您将需要一个默认视图
//当您的url末尾有/Car时，将显示此信息
);

如果您不想手动键入URL来更改视图。。。您必须包含一个指向相应视图的

或

尝试

，不要忘记从“react router dom”添加

{…NavLink…}

你们可能想看看第页的react路由器。他们是创建和维护
react路由器
的人。好的文档
 不需要this.props.children，仅当您访问相应的URL时才会执行路由。本例中也不需要类组件。