React Rout v-4 `this.props.match.params` **undefined** and `staticContext` undefined

user_5404861 0
Viewed 22530

I am using 

    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-router": "^4.1.2",

Hare my rout :

<BrowserRouter>
        <div>
            <Route exact path='/' component={Layout}></Route>
            <Route path='/about' name="about" component={About}>
                <Route path="/:article" component={anotherAbout}></Route>
            </Route>
            <Route path='/protfolio' name="protfolio" component={Portfolio}></Route>
        </div>
    </BrowserRouter >

When i am call {this.props.match.params.article} it give undefined

And my Console: this.props enter image description here

Why staticContext: undefined and my props.match.params null object.

react-router reactjs javascript
2 Answers

I think this is happen because of nested routes. Instead of using nested ones use

<BrowserRouter>
    <div>
        <Route exact path='/' component={Layout}></Route>
        <Route path='/about' name="about" component={About}></Route>
        <Route path="/about/:article" component={anotherAbout}></Route>
        <Route path='/protfolio' name="protfolio" component={Portfolio}></Route>
    </div>
</BrowserRouter >

and destructuring the matched params of url

const { article } = this.props.match.params

I think this works

user_98802760
Related