第十四单元(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. OAuth 2.0授权框架详解

    目录 简介 OAuth的构成 refresh Token Authorization Code模式 隐式授权 Resource Owner 授权密码认证 Client 认证授权 github的OAut ...

  2. apache-commons和guava的工具类

    apache-commons工具类:https://www.iteye.com/blog/zhoualine-1770014 guava工具类:https://blog.csdn.net/Dream_ ...

  3. 主板上来了一个新邻居,CPU慌了!

    大家好,我是CPU一号车间的那个阿Q,好久不见,我想死你们了- 不认识我的请去这里这里补补课:完了!CPU一味求快出事儿了! 主板上的新邻居 "阿Q,快别忙了,马上去一趟会议室,领导有重要事 ...

  4. MathType中如何输入正、余弦函数

    MathType是一款强大的数学公式编辑器,正.余弦函数也是中学中非常重要的一节知识点,今天我们介绍一下在MathType中怎么输入正.余弦函数. 具体步骤如下: 步骤一 打开专业的公式编辑软件Mat ...

  5. 安装Ubuntu时到底该如何分区

    安装系统:Ubuntu16.04(单系统) /(根分区),主分区,   Ext4文件系统,100G-200G /boot分区,   逻辑分区,Ext4文件系统,~200MB /home分区, 逻辑分区 ...

  6. CentOS 防火墙常用命令

    1.查看防火墙状态: firewall-cmd --state 2.启动防火墙 systemctl start firewalld 3.关闭防火墙 systemctl stop firewalld 4 ...

  7. 牛客编程巅峰赛S2第4场

    牛客编程巅峰赛S2第4场 牛牛摆玩偶 题目描述 牛牛有\(n(2 \leq n \leq 10^5)(2≤n≤105)\)个玩偶,牛牛打算把这n个玩偶摆在桌子上,桌子的形状的长条形的,可以看做一维数轴 ...

  8. 【python】Matplotlib作图中有多个Y轴

    在作图过程中,需要绘制多个变量,但是每个变量的数量级不同,在一个坐标轴下作图导致曲线变化很难观察,这时就用到多个坐标轴.本文除了涉及多个坐标轴还包括Axisartist相关作图指令.做图中label为 ...

  9. JDBC【3】-- SPI技术使用以及在数据库连接中的使用

    目录 1.SPI是什么? 2.如何使用SPI来提供自定义服务? 2.1 DBInterface定义接口 2.2 模拟Mysql实现驱动 2.3 模拟SqlServer实现驱动 2.4 模拟用户使用不同 ...

  10. C++基础练习1

    1 /* 2 //读入一个双精度浮点数,保留12位小数输出这个浮点数. 3 #include<iostream> 4 #include <iomanip> 5 using na ...