Pourquoi mon application React affiche-t-elle une page vierge et comment y remédier ?

Page blanche dans l'application React : résolue

Lorsque vous rencontrez une page blanche lors du développement d'une application React, il est important d'enquêter rapidement sur le problème. Comme vous l'avez mentionné dans votre requête, votre page n'affiche rien principalement en raison d'un problème de rendu de composant.

La cause première réside dans la version de réagir-router-dom que vous utilisez. Dans react-router-dom@6, le composant Route a subi des modifications. Les accessoires de fonction composant, rendu et enfants ne sont plus pris en charge. Au lieu de cela, le contenu routé est rendu sur l'accessoire d'élément en tant que ReactNode, essentiellement en JSX.

Pour résoudre ce problème, vous devrez mettre à jour vos composants Route pour adhérer à la nouvelle syntaxe. Voici un exemple de ce à quoi devrait ressembler votre code mis à jour :

<Router>
  <Routes>
    <Route path="/" element={<Home />} />
    <Route path="/wallet" element={<Wallet />} />
  </Routes>
</Router>

Dans ce code modifié, vous avez déplacé les composants Home et Wallet dans l'élément prop et les avez transmis en tant que JSX au lieu de références de composants. Cela devrait maintenant afficher correctement les pages respectives de votre application.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!