Question

我在index.js文件中使用ReactDom进行渲染。

ReactDOM.render(
    <Provider store={store}>
        <HashRouter>
            <Route path="/:myParam">
                <Switch>
                    <SomeProvider myParam={HOW_TO_ACCESS_MY_PARAM_HERE}>
                        <Route path="/:myParam/home" component={Home}/>
                        <Route path="/:myParam/test" component={MyTest}/>
                    </SomeProvider>
                </Switch>
            </Route>
        </HashRouter>
    </Provider>,
    document.getElementById('root')
);

我正在寻找将route param作为道具传递给SomeProvider

的方法

总是myParam并且Home和MyTest组件中的this.props.match.params.myParam可以使用它，但我需要在第一个Route的子项内访问它。< / p>

有没有办法可以在那里得到它？在入口点文件中，而不是组件。

Answer 1

您可以使用withRouter从match的任何孩子访问<Route>：

import { withRouter } from 'react-router-dom'

class SomeProvider extends Component {
  ...
  render() {
    const myParam = this.props.match.params.myParam;
    ...
  }
}

export default withRouter(SomeProvider)

这样做，您不需要将myParam作为道具传递。

如何在儿童中访问最近的<route>匹配？

1 个答案: