您好,登錄后才能下訂單哦!
這篇文章主要介紹“react中npm如何安裝路由”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“react中npm如何安裝路由”文章能幫助大家解決問題。
react中npm可以用“npm i react-router-dom -S”安裝路由;參數i是install的簡寫,會檢測與當前版本最匹配的npm包版本號,參數“-S”是“--save”的簡寫,會把模塊寫入到packages.json中。
本教程操作環境:Windows10系統、react17.0.1版、Dell G3電腦。
一. react路由安裝
npm i react-router-dom@5.0 -S
安裝完成后進入App.js中引用
導入路由相關組件(首字母必須大寫)
導入哈希路由 別名router
Route 路由頁面
NavLink 導航鏈接
import { HashRouter as Router, Route, NavLink} from 'react-router-dom'
二. react路由的使用
實例:
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> }
關于“react中npm如何安裝路由”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。