reactjs - react component props does not have match

Question

I'm using react-routing-dom V5 in my react project. I need to pass props from App component (where I import Router) to child component through protected route. The problem is that props is empty, does not have match, location, history..

**App Component

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

class App extends Component {
  render(){
    console.log(this.props); //props does not have match propreties
    return (
    <div className="App">
        <Router>
          <React.Fragment>
            <Switch>
             <ProtectedRoute path='/exemple' component={Exemple}/>
             </Switch>
          </React.Fragment>
        </Router>
    );
 }
}

NOTE: I pass props from App to child component where i need to use this.props.match, but match is undefinded

标签： reactjsreact-routermatch

Answer 1

match props is only available to components of a route:

<Route exact path="/foo" component={({ match }) => console.log(match)} />

If you need it on App, you need to create a route for App.