how to use props for a component in index.js with react router v6.0

user_19055275 0
Viewed 24

Started using react router v6.3 today, and i implemented it on the index.js, and everything works fine when the link is http://localhost:3000/, but when i click the link to go to the cart component, it returns an error because the cart props is located in the App.js not index.js, Is there a way to use the props from App.js in index.js?

index.js
import Cart from ./src/Cart

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
    <Router>
        <Routes>
            <Route path ="/" element ={<App/}  />
             <Route path ="cart" element ={<Cart cart ={cart}/}  />
        </Routes>
    </Router>
  
);

reactjs javascript
1 Answers

Of course. You should use something like this:

<Route path='/' element={<App />}>
    <Route path='ways-of-magic/:way' element={<MagicWay />} />
</Route>

And in page Cart take it from url

user_180914800
Related