search

Home  >  Q&A  >  body text

Click on pictures of different genders

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.

P粉122932466P粉122932466441 days ago590

reply all(1)I'll reply

  • P粉587780103

    P粉5877801032023-09-15 15:14:52

    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;

    reply
    0
  • Cancelreply