首页
首页
沸点
课程
直播
活动
竞赛
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
可乐好喝不胖
前端工程师 @Bytedance
·
5年前
关注
屏蔽作者: 可乐好喝不胖
举报
推荐一个很好的文章,讲解了React的function component与class component最大的一个区别。我来简单的总结一下:
1. 在React中,每一次渲染都是独立的。对于函数组件而言,它在某一次渲染时所能访问到的变量只与那一次的渲染环境有关。因此,如果你执行了异步操作,并且外部更新了props,异步操作最后访问到的是触发异步操作时的环境变量(旧的Props)。
2. props是不变的。因此,组件的每一次渲染访问的props都是不同的。由于类组件是通过this.props的形式来访问props的变量的,props是不变的,可是this.props是变化的,每一次都会指向最新的props。因此,相同情况下,类组件会访问到最新的值。
3. 对于React hooks而言,也会有这个问题。由于每一次渲染都是独立的,因此,如果你在异步操作里访问useState或者传入的props的值,取到的是触发异步操作时的那次渲染的值,而不是最新的。如果想一直访问最新的,可以使用ref的方式或者把异步操作放到useEffect里,将依赖项写在useEffect的第二个参数里。
展开
How Are Function Components Different from Classes?
overreacted.io
等人赞过
分享
2
5
相关推荐
JYM,你们敢天天踩点下班吗?
15 赞 ·
331 评论
周五啦
30 赞 ·
153 评论
兄弟们是这样的,昨天晚上我发现我女朋友手机微信聊天背景是个男人,好像在和一个男的聊天。 我仔细一看这个男的我见过,她们之前就认识,是同事关系。她们之间关系很好,在公司是饭搭子的好友。 但是那个男的给她发了一张上半身照片,我女朋友还保存下来了。 后来她去洗澡了,我想着感觉不太对,于是她洗完澡我想看她手机聊天记录。她威胁说要和我分手。 后来我就没提了,但是我左想右想总觉得自己没做错什么,我该怎么办,不看的话我心里有点不舒服 我要是看就分手
52 赞 ·
461 评论
相关推荐
JYM,你们敢天天踩点下班吗?
15 赞 ·
331 评论
周五啦
30 赞 ·
153 评论
兄弟们是这样的,昨天晚上我发现我女朋友手机微信聊天背景是个男人,好像在和一个男的聊天。 我仔细一看这个男的我见过,她们之前就认识,是同事关系。她们之间关系很好,在公司是饭搭子的好友。 但是那个男的给她发了一张上半身照片,我女朋友还保存下来了。 后来她去洗澡了,我想着感觉不太对,于是她洗完澡我想看她手机聊天记录。她威胁说要和我分手。 后来我就没提了,但是我左想右想总觉得自己没做错什么,我该怎么办,不看的话我心里有点不舒服 我要是看就分手
52 赞 ·
461 评论