0

There is routing on React-route

render(
<Provider store={store}>
    <Router history={browserHistory}>
        <Route path='/' component={App}>
            <IndexRoute  component={Home} />
            <Route path='/products' component={Products} />
            <Route path='*' component={NoMatch} />
        </Route>

    </Router>
</Provider>,
document.getElementById('root')
);

Smart App component that is the container

class App extends Component {
render() {

    return (
        <div className='page-content'>
            <Sidebar />

            <Content>
                {this.props.children}  // ---> Here output content from child routes
            </Content>

        </div>
    )
}
}

Here is Products component from which I'm trying to get props.products from the App container. But the Products component does not see the container props App. I think this is because the App is two levels higher

export default class Products extends Component {

constructor(props) {
    super(props)
}

loadProducts() {
    this.props.getProducts()
}

render() {
    console.log(this.props.products); // undefined

    return (
        <div>
           <h3>Products</h3>

        </div>
    )
}
}

In the container App there is props.products I checked in chrome-dev-tools. But how do you pass it to the Products component?

coder fire
  • 993
  • 2
  • 11
  • 24
  • App is ot two levels higher but the direct parent. However if you are getting the prop in App component through redux state you can get the same in product component using mapStateToProps there – Shubham Khatri Jun 11 '17 at 16:20
  • Alternatively, I think you can pass `props` to `this.props.children` as described [here](https://stackoverflow.com/questions/32370994/how-to-pass-props-to-this-props-children). – Saad Jun 11 '17 at 16:22
  • @ShubhamKhatri I think this is bad way for solve my issue )) – coder fire Jun 11 '17 at 16:53
  • @saadq Thunk you, I found solution with your link – coder fire Jun 11 '17 at 16:55
  • Possible duplicate of [How to pass props to {this.props.children}](https://stackoverflow.com/questions/32370994/how-to-pass-props-to-this-props-children) – Yuriy Yakym Jun 11 '17 at 20:33

0 Answers0