Joe Barbaro
Joe Barbaro

Reputation: 23

how to render multiple components that has multiple props with the same route?

here i have one Route that i want it to render two components and each component has its own props, but it's not working!! it renders nothing

        <Route path='/products' components={{top:() =>
    <FilterBar sortProducts={this.sortProducts} sort={this.state.sort} 
        count={this.state.prods.length} SearchChange={this.onSearchChange} />,
           main:()=> <Products addToCart={this.addToCart}  prods={filterdProducts} />
    }}/>
      
      
  **one component is a filter bar and the other is products list so i need to render them both at the same route please help**

Upvotes: 0

Views: 140

Answers (1)

Adil Zamal
Adil Zamal

Reputation: 26

What you can do is you can put your two components inside Route .

<Route path="/path">
 <Component1 />
 <Component2 />
</ Route>

and you can pass different props.

Upvotes: 1

Related Questions