red house 87
red house 87

Reputation: 2415

React router - accessing props within route

I'm new to React Router and i'm trying to pass down some props from one of my parent components down to a child one through a route.

Here is my code:

import React, {Component} from 'react';
import Sitefeedback from '../sections/comments/site-feedback';
import { BrowserRouter,Switch, Route  } from 'react-router-dom';

class Outer extends Component { 
    constructor(props) {
        super(props); 
    }

myFunction = () => {
    console.log("hello");
}

render() {
<div className="app-content-wrap-inner">   
    <BrowserRouter>
         <switch>
             <Route path='/site-feedback' render={(props) => (<Sitefeedback {...props} />)}/>
             <Route path='/logins' component={Logins} /> 
         </switch>
    </BrowserRouter>  
</div>
}
}

Ideally I would like to be able to trigger myFunction from the child component. After doing some research I thought passing the Route a render option instead of component would pass it down however it doesn't. Any idea how I can get the function passed down into the routes component?

Upvotes: 1

Views: 548

Answers (1)

Gardezi
Gardezi

Reputation: 2842

I don't know if you still need help with this, but if you do you can do it like this

<Route path='/site-feedback' render={props => (<Sitefeedback {...props} />)}/>

Upvotes: 1

Related Questions