reactjs - 如何在react组件中访问url参数

Question

我有一个在路由上加载的 react 组件

我需要从组件构造函数内的 url 访问参数

我该怎么做？

我可以这样访问它:

class CustomCoponent extends React.Component {
    constructor(props,{match}) {
    }
}

Answer 1

您可以通过从 match 属性获取参数来访问 react-router-dom v4.x 中的路由参数。

在哪里定义路线，

import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';

...
<Router>
  <App>
    <Switch>
      <Route exact path="/" component={List} />
      <Route path="/:parameterToAccess" component={CustomComponent} />
    </Switch>
  </App>
</Router>
...

在您的组件中，

class CustomComponent extends React.Component {
   constructor(props) {
     super(props);
     this.routeParam = props.match.params.parameterToAccess;
   }
}