Bonjours à tous, je débute sur react et je teste les routeurs.

Grace à ce tuto:

https://www.ibrahima-ndaw.com/fr/blog/the-complete-guide-to-react-router/#quest-ce-que-le-routage

j'ai put concevoir une premier application mais le contenu de la page s'affiche que lorsque on rafraichi la page. Je voudrait effectivement que le contenu s'affiche lors du click.

Cordialement:

voicu le code de App.js

import React, { Component } from 'react';
import {
  BrowserRouter as Router,
  Route,
  Link,
  Switch,
} from 'react-router-dom'
 
import './App.css';
 
import Home from './Home';
import About from './About';
import Contact from './Contact';
import NotFound from './NotFound';
 
 
class App extends Component {
  render() {
    return (
      <Router>
        <div>
          <header>
            <section>
              <h1> react-starter </h1>
              <h2> (React version 18.0.2) </h2>
            </section>
            <nav>
              <ul>
                <li><Link to="/">Home</Link></li>
                <li><Link to="/about">About</Link></li>
                <li><Link to="/contact">Contact</Link></li>
              </ul>
            </nav>
          </header>
          <main>
            <Switch>
              <Route exact path="/" component={Home} />
              <Route path="/about" component={About} />
              <Route path="/contact" component={Contact} />
              <Route exact path="*" component={NotFound} />
            </Switch>
          </main>
        </div>
      </Router >
    );
  }
}
 
export default App;

1 réponse


Bonjour,

Sur la partie du component où tu ajoutes le component <Route />, il faut y ajouter autre chose.
Je te laisse regarder le lien que tu as donné pour accéder à ton tutoriel. C'est vraiment du copier collé.