Реакция - не удается прочитать свойство 'params' из неопределенного

Question

Я установил параметры в Route. Они появляются в консоли из моего компонента, но я получаю «неопределенную» ошибку.

<Router>
    <App>
        <Switch>
                <Route exact path='/data/:param' component={data} />
        </Switch>         
    </App>
</Router>

компонент

class Data extends Component {
    constructor(props) {
        super(props);

    async componentDidMount() {
        console.log(this.props.match.params.param)

    ...

export default Data;

Если я вижу их в консоли почему я по-прежнему получаю сообщение об ошибке?

Необработанный отказ (TypeError): невозможно прочитать свойства 'params' из неопределенного

Answer 1

Вы должны убедиться, что ваш импорт корректен для Route, который равен Data.

import Data from './Data';
...
     <Route exact path='/data/:param' component={Data} />
...

Вам не нужно заключать компонент в компонент высшего порядка withRouter, так как ваш компонент Data уже является потомком Route.

FWIW do

componentDidMount() {
  console.log(this.props.match && this.props.match.params.param);
}

Кроме того, вам, вероятно, не нужен async при выполнении componentDidMount(). Это также может быть причиной того, что вам нужно добавить защитный код, как указано выше.

PS: console.log() может показывать оцененные данные, которые обычно представлены i только помимо объекта eval.