答疑解惑01|如何转换应用React Hooks 的思路?
王沛
你好,我是王沛。今天我们来对第一章的内容进行集中答疑。
不知不觉我们的基础篇已经讲完了,也很高兴看到你在交流区积极留言,提出了很多有意义的问题。所以这节课呢,我会针对一些具有代表性的问题,进行集中答疑。一方面算是对课程内容作一个有针对性的补充,另外一方面也希望能对更多的同学有所帮助。
我会先对评论区的提出的几个具有代表性的问题进行讲解,然后再对课程中的几个思考题,做一个回答参考,并给出代码示例。
留言区的问题
02 讲
问题:文中的例子里说,窗口大小发生变化,组件就会更新。对于这一点我不太理解,Class 封装的还可以理解为,state 发生改变了,导致重新 render 了,但 Hooks 感觉这么理解并不通顺,Hook 哪里写得就类似一个纯函数调用,是怎么驱动组件重新更新的呢?
讲解:一个很好的问题,这是很多初学 Hooks 的同学都会有的困惑:一个普通函数怎么就让组件刷新了呢?其实答案也特别简单,那就是自定义 Hooks 中也是通过 useState 这样的内置 Hook 来完成组件的更新的。
可能你会觉得,自定义 Hooks 中一定会用到 state 吗?如果你写多了就会发现,自定义 Hooks 要实现的逻辑,要么用到 state,要么用到副作用,是一定会用到内置 Hooks 或者其它自定义 Hooks 的。
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线
笔记
复制
AI
- 深入了解
- 翻译
- 解释
- 总结
本文是关于React Hooks的应用和转换思路的答疑文章。作者通过回答读者提出的一些关于React Hooks的疑问,深入解释了Hooks的工作原理和使用方法。其中包括对useState、useEffect、useCallback等Hooks的使用场景和注意事项的详细讲解。同时,作者还提供了一些课后思考题,并给出了相应的解答和代码示例,帮助读者更好地理解和应用React Hooks。 在文章中,作者重点解释了Hooks中如何实现组件的更新、副作用的处理以及性能优化等方面的内容。此外,作者还通过具体的代码示例,展示了如何在自定义Hooks中实现灵活配置点击加号时应该加几的功能,以及如何在Redux中实现每次调用时增加或减少指定的变量值。这些内容对于读者理解和应用React Hooks具有很高的参考价值。 总的来说,本文通过解答读者提出的问题和提供实际的代码示例,帮助读者更好地理解和转换应用React Hooks的思路。对于正在学习或使用React Hooks的开发者来说,本文提供了宝贵的技术指导和实用建议。
仅可试看部分内容,如需阅读全部内容,请付费购买文章所属专栏
《React Hooks 核心原理与实战》,新⼈⾸单¥59
《React Hooks 核心原理与实战》,新⼈⾸单¥59
立即购买
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
登录 后留言
全部留言(9)
- 最新
- 精选
- TMiRobot老师,React 文档提到“React 保证了 setState 函数标识是稳定的,并且不会在重渲染时改变,因此在 useEffect 和 useCallback 的依赖列表中忽略它是安全的。” useCallback(() => setCount(count - n), [count]) 那像这种优化是不是没有必要,根本不需要再去包裹一层 useCallback
作者回复: 可以保证在 count 不变化的时候不会产生新的回调函数。
2021-06-181 - Geeker我是假期学习第一人2021-06-129
- 盖世英雄hooks也用的两年了,一直都停留在使用,完成功能上! 没有深入了解过,感谢老师!2021-06-2514
- 小鸟淫太老师您好,我在网上看到说过度使用 useCallback 会对性能有影响。 https://blog.csdn.net/weixin_47143210/article/details/1061933232021-06-1422
- 吴颜文中奖“但是始终使用 useCallback 是个比较好的习惯。”,这个感觉很难认同,而使用react过程中也确实极少使用useCallback,useCallback在函数组件中的作用我感觉与函数组件本身是有点格格不入的,我体验useCallback更多是为了保证react功能的完备性而推出的,是为了“解决问题”而非用来日常开发使用2023-09-07归属地:北京
- Jackchoumine副作用一定是和当前 render 的结果没关系的,而只是 render 完之后做的一些额外的事情?很不理解这里。为何说副作用和当前render 结果无关呢? 比如接口发返回了,要重新设置 state 就是会触发重新渲染,就是和渲染结果相关的。 我时哪儿没有理解到位吗?2023-06-06归属地:贵州1
- Jia添!补充 : useAction实际上不仅用起来麻烦且无法通过eslint-hooks检测,而且根据官方文档Dan的说法,不仅不符合hooks思想,也没有必要(因为函数式编程,hooks api是直接使用调用结果,甚至没有原先oop式独立的component中间层)。 所以useAction在最新的alpha版本中已经凉了。2022-01-04
- micstonehooks2021-06-14
- 与你.逃不过万年老二2021-06-142
收起评论