点击上方 前端Q,关注公众号
回复加群,加入前端Q技术交流群
大家好,我是小杜杜,俗话说的好,工欲善其事必先利其器,什么意思呢?就是说你想玩转React
就必须知道React
有什么,无论是否运用到,首先都要知道,提升思维广度~
其实React
官方提供了很多Api
,只是这些Api
我们并不常用,所以往往会忽略它们,但在一些特定的场景下,这些Api
也会起到关键性的作用,所以今天就逐个盘点一下,说说它们的使用方法和使用场景。
当然这些Api
并不需要全部掌握,只需要知道有这个知识点就好了~
本文将会全面总结所有的React
Api,包含组件类
、工具类
、生命周期
、react-hooks
、react-dom
五大模块,并配带示例,帮助大家更好的掌握,大家可以边嗑瓜子边阅读,如有不全、不对的地方欢迎在评论区指出~
由于本文过长,建议点赞
+收藏
, 在正式开始前,我抽取了一些问题,一起来看看:
1.React v18
中对react-dom
做了那些改动,增加了那些新的hooks
?
2.useRef
除了获取元素的节点信息,还能做什么?
3.为什么会有Children.map
?它与不同的遍历有和不同
4.类组件的生命周期在不同的版本是怎样变化的?
5.子元素如何渲染到父元素上面的?
...
其实问题很多,看完这篇文章后,相信一定能帮你解答的非常清楚,还请各位小伙伴多多支持一下
前言
在之前的几篇文章中,有自定义hooks
、HOC
、虚拟DOM
和diff算法
,多多少少都有React官方Api做为基础条件,我的这个专栏的目的就是对React
的深入,就是希望对React
有一个全面的提升
写这篇文章的主要目的有:
提升知识广度,要想深入React
就必须全面了解React
,首先要学会用,要知道,如果连知道都不知道,谈何深入?
React v18
对 react-dom
的改动还是比较大的,并且新增了五个hooks
,逐一盘点一下,看看做了那些改动
这个专栏实际上是循序渐进的,相互之间都有一定的关联,同时要想看懂,也需要有一定的React
基础,对刚开始学习React
的小伙伴可能并不是太友好,所以特地总结一番,用最简单的示例,帮你掌握这些Api
对之后的源码有帮助,所以本篇文章将会全面解读React Api
的使用方法,和场景,如有不足,还希望在评论区指出~
附上一张今天的学习图谱~
全面解读ReactApi.png
组件类
Component
在React中提供两种形式,一种是类组件
,另一种是函数式组件
,而在类组件
组件中需要使用Component
继承,这个组件没有什么好讲的,我们可以看看源码:
文件位置packages/react/src/ReactBaseClasses.js
image.png
可以看出Component
进行一些初始化的工作,updater
保存着更新组件的方法
PureComponent
PureComponent:会对props
和state
进行浅比较,跳过不必要的更新,提高组件性能。
可以说PureComponent
和Component
基本完全一致,但PureComponent
会浅比较,也就是较少render
渲染的次数,所以PureComponent
一般用于性能优化
那么什么是浅比较,举个
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)