本教程操作环境:windows10系统、react17.0.1版、dell g3电脑。
react中npm怎么安装路由一. 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视频教程》
以上就是react中npm怎么安装路由的详细内容。
