如何使用React Router DOM访问父组件中的param

Question

我的路线就像

<BrowserRouter>
  <App>
    <Switch>
      <Route path="/:locale?" component={Home}/>
    </Switch>
  </App>
</BrowserRouter>

应用程序组件

class App extends Component {
    componentDidMount() {
        if (this.props.match) {
            console.log(this.props.match);
        }
    }
}

我在这里未定义。这仅适用于Home组件。

我需要一些解决方法来根据每个Route的:locale更改语言状态。我不想为每个路径组件手动执行此操作。

Answer 1

如果您不想在App内呈现Route，则可以使用withRouter提供的react-router HOC。在您的App组件中：

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

class App extends Component {
  ...
}

export default withRouter(App);