84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
How to click on a men's or women's clothing image to open a different clothing product on another page in ReactJS using React Router? I searched on Google and found nothing.
I am using the map to cycle through each men's or women's clothing product.
The following example may help you solve the problem:
import React from 'react'; import { BrowserRouter as Router, Route, Link } from 'react-router-dom'; const App = () => { return ( <Router> <div> <nav> <ul> <li> <Link to="/mens-clothing">Men's Clothing</Link> </li> <li> <Link to="/womens-clothing">Women's Clothing</Link> </li> </ul> </nav> <Route path="/mens-clothing" component={MenClothingPage} /> <Route path="/womens-clothing" component={WomenClothingPage} /> </div> </Router> ); }; export default App;
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
The following example may help you solve the problem:
import React from 'react'; import { BrowserRouter as Router, Route, Link } from 'react-router-dom'; const App = () => { return ( <Router> <div> <nav> <ul> <li> <Link to="/mens-clothing">Men's Clothing</Link> </li> <li> <Link to="/womens-clothing">Women's Clothing</Link> </li> </ul> </nav> <Route path="/mens-clothing" component={MenClothingPage} /> <Route path="/womens-clothing" component={WomenClothingPage} /> </div> </Router> ); }; export default App;