reactjs - 通过路径从 react-router 获取组件

Question

如何通过路径从react-router v4获取Component？

我正在寻找一种方法来通过路径获取之前配置的组件。

例如我有这条路线:

import React from 'react';
import UserScreen from './UserScreen';
...
<Route path='/user/:id' component={UserScreen}/> 

现在我想通过路径获取UserScreen组件。像这样:

getComponentByPath(path){
   // looking for this section 😀
}

render(){
  const component = getComponentByPath('/user/12');
  return (<component />);
}

我正在寻找组件对象。

Answer 1

您可以使用 BrowserRouter react router v4 并渲染具有相应路由的组件。

<BrowserRouter>
    <Switch>
      <Route path='/user/:id' component={UserScreen}/> 
   </Switch>
</BrowserRouter>

制作一个UserScreen.js:

class UserScreen extends Component {

render() {

    return (
    <div>hello world</div>
    )
  }
}