const rootEl = document.getElementById('root'); ReactDOM.render( <BrowserRouter> <Switch> <Route exact path="/"> <MasterPage /> </Route> <Route exact path="/details/:id" > <DetailsPage /> </Route> </Switch> </BrowserRouter>,rootEl );
我正在尝试访问DetailsPage组件中的ID,但它无法访问.我试过了
<DetailsPage foo={this.props}/>
将参数传递给DetailsPage,但是徒劳无功.
export default class DetailsPage extends Component { constructor(props) { super(props); } render() { return ( <div className="page"> <Header /> <div id="mainContentContainer" > </div> </div> ); } }
那么任何想法如何将ID传递给DetailsPage?
如果要将props传递给路径中的组件,最简单的方法是使用渲染,如下所示:
<Route exact path="/details/:id" render={(props) => <DetailsPage globalStore={globalStore} {...props} /> } />
您可以使用以下方法访问DetailPage内的道具:
this.props.match this.props.globalStore
传递原始Route的道具需要{… props},否则你只能在DetailPage中获得this.props.globalStore.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。