reactjs - React Router - passing location prop through function in Route

Question

Is there a way to pass the location prop and own made prop to another component? I've figured out how to pass DIR_URL through a function like below but I also need to use location prop later in ConfirmAccount component to read pathname property and so on. (Of course in this way it gets true value).

import React, { Component, Fragment } from 'react';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
import Main from './components/structure/Main';
import ConfirmAccount from './components/pages/ConfirmAccount';
import NoMatch from './components/pages/NoMatch';

class App extends Component {
  render() {
    const url = 'http://localhost:3006';
    return (
      <Fragment>
        <Router>
          <Switch>
            <Route exact path="/" component={Main} />
            <Route path="/confirm">
              {/* How can I pass the location? */}
              <Route path="/:url" component={() => <ConfirmAccount DIR_URL={url} location />} />
            </Route>
            <Route component={NoMatch} />
          </Switch>
        </Router>
      </Fragment>
    );
  }
}
export default App;

Answer 1

React Router DOM automatically passes match location and history props.

You can use the route render prop to pass them manually if you wish:

<Route path="/:url" render={(routeProps) => <ConfirmAccount DIR_URL={url} {...routeProps} />} />