作用:
能够更方便地给组件传递额外的属性
<Route path={xx} render={props=>{
return <组件 {...props}></组件>
</Route>
因为渲染的组件不是路由组件,所以需要传入props
代码示例:
import React from 'react';
import './App.css';
import {Switch,Route,Redirect} from 'react-router-dom'
import {Button} from 'antd'
import 'antd/dist/antd.css'
import {adminRoutes} from './routes/index'
function App() {
return (
<div className="App">
<h1>app</h1>
<Switch>
{adminRoutes.map(route=>{
return <Route key={route.path} path={route.path} exact={route.exact} render={routeProps=>{
return <route.component {...routeProps}></route.component>
}}></Route>
})}
<Redirect to='/404'></Redirect>
</Switch>
</div>
);
}
export default App;