Dans npm in React, vous pouvez utiliser "npm i react-router-dom -S" pour installer le routage ; le paramètre i est l'abréviation de install, qui détectera le numéro de version du package npm qui correspond le mieux à la version actuelle. le paramètre "-S" est "-- L'abréviation de "save" écrira le module dans packages.json.
L'environnement d'exploitation de ce tutoriel : système Windows 10, React version 17.0.1, ordinateur Dell G3.
1. Installation du routage React
npm i react-router-dom@5.0 -S
Une fois l'installation terminée, entrez App.js pour citer
Importer les composants liés au routage (la première lettre doit être en majuscule)
Importer un alias de routage de hachage
Page de routage d'itinéraire
Lien de navigation NavLink
import { HashRouter as Router, Route, NavLink} from 'react-router-dom'
2. Utilisation du routage de réaction
Exemple :
import {HashRouter as Router , Route , NavLink} from 'react-router-dom' function App(){ return (<Router > {/* 导航 */} <div> {/*exact 默认显示*/} <NavLink to='/' exact>首页</NavLink> <NavLink to='/about'>关于</NavLink> </div> {/* 路由页面 */} <Route path="/" exact component={Home}></Route > <Route path="/about" component={About}></Route > </Router >) } export default App; function Home(){ return <div>首页页面</div> } function About(){ return <div>关于页面</div> }
Ceci est réalisé en mettant à jour la vue mais sans redemander la page. Si vous souhaitez en savoir plus, vous pouvez cliquer pour consulter la documentation officielle.
Apprentissage recommandé : "Tutoriel vidéo React"
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!