react-router-dom路由

1、React路由介绍

1.1、单页面应用

单页面得特点:只需要加载一次主页面,通过局部刷新,就可以实现跳转或者切换页面

优点:加载速度快,用户体验比较好

缺点:

  • 第一次加载比传统要慢一点
  • 不利seo
  • 页面相对复杂
  • 返回键

1.2、安装react-router-dom

在项目命令行中,执行

cnpm install react-router-dom -S

下载到生产环境的依赖中。

在组件中通过对象的解构方式去获取到react-router-dom内置组件,在组件中,按需引入内置组件,在页面中进行使用:

  • HashRouter表示一个路由的根容器,将来所有的路由相关的东西,都要包裹在HashRouter里面,而且一个网站中,只需要使用一次HashRouter就好了;
  • Route表示一个路由规则,在Route上,有两个比较重要的属性,path,component
  • Link表示一个路由的链接,属性to
import {HashRouter,Route,Link} from 'react-router-dom'

代码示例:

render(){
        ret

猜你喜欢

转载自blog.csdn.net/p445098355/article/details/105217993