好记性不如烂笔头——React篇

简介: 好记性不如烂笔头——React篇

640.png

一、项目初始化



640.png

二、UI层面


640.png

2.1 JSX基础


640.png



2.2 进阶


2.2.1 事件处理


640.png

2.2.2 条件渲染

640.png


2.2.3 列表


640.png


2.2.4 表单

640.png


三、组件



640.png

3.1 class组件


3.1.1 使用class组件需满足条件

640.png

3.1.2 相关属性方法

640.png


3.1.3 声明周期图谱

640.png

3.2 function组件

640.png

3.2.1 HOOK

640.png

3.2.1.1 函数


640.png


3.2.1.2 HOOK规则

640.png

3.2.1.3 自定义HOOK

640.png


3.3 高阶组件

640.png


四、数据层面



640.png五、重要包


640.png


六、感悟


在整理这些基础知识点的过程中,有以下几点感悟,不一定正确,分享出来与大家探讨:


  1. React中很多功能在开发中用的并不多,例如:数据传输方面Redux+props即可满足很多需求、Hook中常用的也只有useState、useEffect等,实现的一些功能仅仅是为了满足整个框架的完整性;


  1. HOOK的出现基本上让function组件一统天下,不必再使用class组件;


  1. 框架在不断向着越来越简单的方向发展。
相关文章
|
3月前
|
存储 缓存 前端开发
react上课提问
react上课提问
|
10月前
|
JavaScript 程序员
使用Vue解决一下吃饭选择困难症
使用Vue解决一下吃饭选择困难症
|
前端开发 JavaScript 开发者
能把队友气死的8种屎山代码(React版)(下)
能把队友气死的8种屎山代码(React版)
122 0
能把队友气死的8种屎山代码(React版)(下)
|
前端开发 JavaScript
能把队友气死的8种屎山代码(React版)(上)
能把队友气死的8种屎山代码(React版)
217 0
能把队友气死的8种屎山代码(React版)(上)
|
前端开发 JavaScript 安全
Vue 选手转 React 常犯的 10 个错误,你犯过几个?
Vue 选手转 React 常犯的 10 个错误,你犯过几个?
|
存储 JavaScript 前端开发
纯手硬撸Redux
当今不管作为一个前端小白还是一个资深的前端攻城狮。如果不掌握几种前端框架(React,Vue,ng),都不好意思出去说自己是做前端。但是面对如此之多的前端框架,尤其是React、Vue这种纯负责UI展示的架子来说。有一件事是绕不开的就是前端的数据存储问题。 作为业界层出不穷的数据处理框架Redux(React的数据存储框架)又是不得不提起的。 Vue的数据处理一般用Vuex。但是他的设计思路都是基于Redux等。 所以,有必要看看Redux是如何实现数据存储,又如何使得存储的数据被组件获取,并且组件在触发CRUD的时候,能够及时更新数据呢。 我们就按照Redux的实现原理来剖析一下这些数据存储
纯手硬撸Redux
|
JavaScript
用Vue3开发,这几个工具你得知道。摸鱼不能耽误
用Vue3开发,这几个工具你得知道。摸鱼不能耽误
用Vue3开发,这几个工具你得知道。摸鱼不能耽误
|
前端开发 JavaScript 测试技术
哈哈,打脸了-react原来不是快
很多人都知道react很快,甚至觉得用react完全不用考虑性能问题。为什么这么人为呢?因为他有visual dom 啊,是不是吧。那visual dom是什么来着?当然咱们这里不说他是个什么玩意儿,咱们就来测下react到底快不快!
84 0
哈哈,打脸了-react原来不是快
|
前端开发 JavaScript
react修仙笔记,请问仙溪几级了?
react在企业项目中已经变成了一个必不可少的UI框架,从过去早期有jquery,后面有bootstrap兴起,jquery可以说二次封装的原生js,bootstarp可以快速搭建一个精美网页,现在基本很少用bootstrap和jquery了,基本上vuejs,react,angular三分天下,国内vuejs和react居多,angular很少用
react修仙笔记,请问仙溪几级了?
|
前端开发 JavaScript API
还记得你与React的那一场“初遇”吗?
还记得你与React的那一场“初遇”吗?
73 0
还记得你与React的那一场“初遇”吗?