第十四单元(react路由-react路由的跳转以及路由信息)

#课程目标

  1. 理解前端单页面应用与多页面应用的优缺点
  2. 理解react路由是前端单页面应用的核心
  3. 会使用react路由配置前端单页面应用框架及实现页面之间的跳转
  4. 认识react路由元信息,学会从react路由元信息中拿到所需要的路由信息
  5. 会使用react路由传参,及通过传参实现页面之间数据的传递

#知识点

  1. react路由库,react-dom(react-router-dom+react-router-native)或者react-router-dom的安装
  2. 了解路由模式:history(BrowserRouter组件) & hash(HashRouter组件)
  3. 路由跳转组件:Link, NavLink和Redirect
  4. 添加路由记录:Switch和Route
  5. 路由元信息:history, location和match
  6. 路由高阶组件:withRouter

#授课思路

#案例和作业

  1. 使用路由实现猫眼电影的页面架构

  2. 使用路由传参实现猫眼电影列表页跳详情

react第十四单元(react路由-react路由的跳转以及路由信息)的更多相关文章

  1. vue第十四单元(认识单页面应用,理解vue-router的基本用法)

    第十四单元(认识单页面应用,理解vue-router的基本用法) #课程目标 1.了解单页应用与多页应用以及各自的优缺点 2.掌握路由如何实现单页应用 3.精通路由的基本语法 #知识点 #一.单页应用 ...

  2. linux基础-第十四单元 Linux网络原理及基础设置

    第十四单元 Linux网络原理及基础设置 三种网卡模式图 使用ifconfig命令来维护网络 ifconfig命令的功能 ifconfig命令的用法举例 使用ifup和ifdown命令启动和停止网卡 ...

  3. react第十二单元(react路由-使用react-router-dom-认识相关的组件以及组件属性)

    第十二单元(react路由-使用react-router-dom-认识相关的组件以及组件属性) #课程目标 理解路由的原理及应运 理解react-router-dom以及内置的一些组件 合理应用内置组 ...

  4. react第十五单元(react路由的封装,以及路由数据的提取)

    第十五单元(react路由的封装,以及路由数据的提取) #课程目标 熟悉react路由组件及路由传参,封装路由组件能够处理路由表 对多级路由能够实现封装通用路由传递逻辑,实现多级路由的递归传参 对复杂 ...

  5. react第十九单元(react+react-router-dom+redux综合案例1)

    第十九单元(react+react-router-dom+redux综合案例1) #课程目标 复习 综合练习 实战能力 #知识点 react react-router redux #授课思路 #案例和 ...

  6. react第十六单元(redux的认识,redux相关api的掌握)

    第十六单元(redux的认识,redux相关api的掌握) #课程目标 掌握组件化框架实现组件之间传参的几种方式,并了解两个没有任何关系组件之间通信的通点 了解为了解决上述通点诞生的flux架构 了解 ...

  7. react第十八单元(redux中间件redux-thunk,redux工程目录的样板代码,规范目录结构)

    第十八单元(redux中间件redux-thunk,redux工程目录的样板代码,规范目录结构) #课程目标 中间件:中间件增强redux的可扩展性,实现功能复用的目的. redux-thunk异步逻 ...

  8. React Native(十四)——Slider

    最近我们rn版的App快要内测了,小伙伴们都在积极的改bug,于是在其中就遇到了关于Slider的部分小知识,特地记录自己用到的部分属性,也许恰好会帮助到用到该组件的你: 属性罗列(https://r ...

  9. 第十四单元 Linux网络原理及基础设置

    ·ifconfig命令来维护网络(详见linux系统管理P422) 1) 掌握ifconfig命令的功能:显示所有正在启动的网卡的详细信息或设定系统中网卡的IP地址.2) 灵活应用ifconfig命令 ...

随机推荐

  1. 玩转百度地图API(地图,坐标,标记,添加控件,2D图,混合图,智能搜索,地址解析器,信息窗口)

    1.注册得到appkey 2.直接上代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Conte ...

  2. Linux学习 - 02 使用 - Centos8 - 『更换rpm/epel包源为国内源』

    1. Centos8 - 『更换rpm/epel包源为国内源』 centos 8 默认是会读取centos.org的mirrorlist的,所以一般来说是不需要配置镜像的. 如果你的网络访问mirro ...

  3. Mac垃圾忘记清理?开启自动清理提醒帮助你!

    Mac系统被广泛应用于各种职场生活和学习生活上,平时由于工作和学习忙碌,用户难免会忽略了对Mac的照料,Mac在日复一日地使用中,必定会逐渐变得"臃肿",系统中存在着各种文件缓存垃 ...

  4. CorelDRAW“出血线”的精准预设与辅助线便捷操作

    CorelDRAW软件是一款常用的制图工具,非常适合用于印刷品输出,各种印刷图文制作都依赖于它.所以,我们设计者每次用CorelDRAW制图的一个关键就是要做好"标尺辅助线"设置, ...

  5. Linux禅道升级教程

    环境: centos7 禅道11.2升级道12.4 稳定版 下载: sudo wget https://www.zentao.net/dl/ZenTaoPMS.12.4.stable.zip 解压: ...

  6. http host头攻击漏洞

    原文地址: https://www.zhuyilong.fun/tech/handel_httphost_attack.html 漏洞描述 为了方便的获得网站域名,开发人员一般依赖于HTTP Host ...

  7. C语言讲义——注释

    注释 什么是注释?  --注释写在代码中的文字,不参与代码编译,不影响运行结果. 为什么要注释?--让代码可读性更强. C语言有两种注释: 单行注释 // 多行注释 /* */ 多行注释可以只有一行, ...

  8. IPv6 Rapid Deployment, IPv6 6rd初探

    IPv6 Rapid Deployment: Provide IPv6 Access to Customers over an IPv4-Only Network 原文地址:https://www.c ...

  9. 使用Python过程出现的细节问题:TypeError: not enough arguments for format string

    今天使用字符串格式化时,遇到的一点小问题:调用这个方法解释器出错了:TypeError: not enough arguments for format string def ll(name,age) ...

  10. model基础操作

    url.py from django.contrib import admin from django.urls import path,include from app1.views import ...