学无止境

【React】immer组件版本10的使用

【React】Warning: Each child in a list should have a unique "key" prop.

【React】useEffect中清除定时器

Redux讲义讲义说明目的：为React移动端项目做支撑：redux、redux-thunk、react-redux（useDispatch、useSelector ）、redux-devtools-extension内容顺序（课程目标）：redux单独使用react-redux 结合react项目进行使用中间件react-thunk的基本使用useDispatch, useSelector的基本使用redux模块管理redux-devtools-extensionRedux基本介绍

1、useRef hook使用场景：在 React 中进行 DOM 操作时，用来获取 DOM作用：返回一个带有 current 属性的可变对象，通过该对象就可以进行 DOM 操作了。const inputRef = useRef(null)解释：参数：在获取 DOM 时，一般都设置为 null返回值：包含 current 属性的对象。注意：只要在 React 中进行 DOM 操作，都可以通过 useRef Hook 来获取 DOM（比如，获取 DOM 的宽高等）。注意：us

1、React Hooks 介绍Hooks 是什么为什么要有 Hooks1.1 Hooks 是什么Hooks：钩子、钓钩、钩住Hooks 是 React v16.8 中的新增功能作用：为函数组件提供状态、生命周期等原本 class 组件中提供的 React 功能可以理解为通过 Hooks 为函数组件钩入 class 组件的特性注意：Hooks 只能在函数组件中使用，自此，函数组件成为 React 的新宠儿React v16.8 版本前后，组件开发模式的对比：React v

1、mixins（已废弃）https://react.docschina.org/blog/2016/07/13/mixins-considered-harmful.htmlmixin引入了隐式依赖关系对于组件中的方法和数据的来源不明确，不容易维护Mixins 导致名称冲突Mixins 导致滚雪球般的复杂性2、render-props技术2.1 组件复用的说明思考：如果两个组件中的部分功能相似或相同，该如何处理？处理方式：复用相似的功能（联想函数封装）复用什么？

1、路由基本介绍现代的前端应用大多都是 SPA（单页应用程序），也就是只有一个 HTML 页面的应用程序。因为它的用户体验更好、对服务器的压力更小，所以更受欢迎。为了有效的使用单个页面来管理原来多页面的功能，前端路由应运而生。前端路由的功能：让用户从一个视图（页面）导航到另一个视图（页面）前端路由是一套映射规则，在React中，是 URL路径 与 组件 的对应关系使用React路由简单来说，就是配置 路径和组件（配对）想要实现单页应用程序（SPA），就必须使用到路由 react-route

react原理介绍

1、概述意义：组件的生命周期有助于理解组件的运行方式、完成更复杂的组件功能、分析组件错误原因等组件的生命周期：组件从被创建到挂载到页面中运行，再到组件不用时卸载的过程钩子函数的作用：为开发人员在不同阶段操作组件提供了时机。只有 类组件 才有生命周期。2、生命周期的整体说明每个阶段的执行时机每个阶段钩子函数的执行顺序每个阶段钩子函数的作用http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/3、挂载阶段执行时机：

0、学习目标组件通讯介绍以及为什么要有组件通讯组件的props组件通讯的三种方式 父传子 子传父 兄弟组件Context组件通讯props深入todomvc1、组件通讯组件是独立且封闭的单元，默认情况下，只能使用组件自己的数据。在组件化过程中，我们将一个完整的功能拆分成多个组件，以更好的完成整个应用的功能。而在这个过程中，多个组件之间不可避免的要共享某些数据。为了实现这些功能，就需要打破组件的独立封闭性，让其与外界沟通。这个过程就是组件通讯。大白话：一个组件使用另一个组件的状态

0、学习目标能够使用函数创建组件-函数组件能够掌握class语法 extends继承能够使用class创建组件-类组件能够给React元素绑定事件能够使用state与setState能够处理事件中this的指向问题能够使用受控组件方式处理表单1、组件基本介绍组件是React中最基本的内容，使用React就是在使用组件组件表示页面中的部分功能多个组件可以实现完整的页面功能组件特点：可复用，独立，可组合2、React创建组件的两种方式2.1 函数组件函数组件：使用JS的函

0、学习目标能够知道什么是jsx能够使用jsx创建react元素能够在jsx中使用javascript表达式 {}能够使用jsx的条件渲染和列表渲染能够给jsx添加样式1、JSX的基本使用1.1 createElement的问题繁琐不简洁不直观，无法一眼看出所描述的结构不优雅，开发体验不好1.2 JSX简介JSX是JavaScript XML的简写，表示了在Javascript代码中写XML(HTML)格式的代码优势：声明式语法更加直观，与HTML结构相同，降低学习成本，提

0、学习目标能够说出react是什么能够说出react的特点能够掌握react的基本用法能够使用react脚手架1、React 介绍react是一个用于构建用户界面的 JavaScript 库react官网(https://reactjs.org/)react中文网(https://zh-hans.reactjs.org/)React 是一个用于构建用户界面（UI，对咱们前端来说，简单理解为：HTML 页面）的 JavaScript 库如果从mvc的角度来看，React仅