0

0

关于useEffect错误用法的推理

碧海醫心

碧海醫心

发布时间:2024-12-07 08:43:09

|

1163人浏览过

|

来源于dev.to

转载

关于useeffect错误用法的推理

React 中最错误使用的 hook 无疑是 useEffect。我们这样做有多种原因,而不仅仅是一个。让我们从我的角度来探讨其中的每一个。

生命周期遗产

所以我认为影响更大的原因之一是,在前钩子时代,我们使用了类。对于这一时期开始使用React的人来说,已经习惯了使用生命周期方法和this.state。我在这篇文章中写了一些相关内容。有人怀念古老而黄金的阶级时代,看重它的简单和直接。这个模型非常符合一般程序员的常识,学习面向对象和命令式编程,并且心理结构恰好与该模型相关。

然后他们添加了钩子。

思维范式转变

问题在于所发生的范式转变。一般来说,程序员都非常熟悉命令式和面向对象范式,他们通常在大学和课程中教授,主要是命令式,遵循人类的共同思维流程。

当你切换到函数式编程等不同范式时,你会面临一种相反的思维方式,这与常见的思维方式不太接近。这种“回归”就更难理解了。

响应式编程也遇到同样的问题。这是从主动编程方式到被动编程方式的转变。我们看到它错误地使用了 useEffect。

大多数“错误”都是状态同步。因此,开发人员使用 useEffect 来跟踪某些状态或 prop,并基于某些逻辑来更改状态。这个案例揭示了我们需要的相反的思维方式。

在 OOP 和命令式编程中,您是主动的,以主动的方式进行更改和逻辑。反应性基于相反的情况,您对机会做出反应,并声明您希望系统在状态发生变化时执行的计算。

对于大多数用户来说,在useEffect上主动设置新的状态是直接的方式,状态发生了变化,所以你需要手动跟踪变化并用它更新其他状态。文档说不推荐,但没有明确的原因。

在 React 中进行派生是推荐的方式,不仅是出于性能原因,而且是出于概念原因。 React 是一个推导机器,最终的结果就是 UI 的推导。您不需要主动处理这些状态转换和重新计算,它只是根据您编写的声明性代码发生。

MVM mall 网上购物系统
MVM mall 网上购物系统

采用 php+mysql 数据库方式运行的强大网上商店系统,执行效率高速度快,支持多语言,模板和代码分离,轻松创建属于自己的个性化用户界面 v3.5更新: 1).进一步静态化了活动商品. 2).提供了一些重要UFT-8转换文件 3).修复了除了网银在线支付其它支付显示错误的问题. 4).修改了LOGO广告管理,增加LOGO链接后主页LOGO路径错误的问题 5).修改了公告无法发布的问题,可能是打压

下载

React 文档没有很好地解释这一点,在 hooks 之后,React 核心团队和内容创建者没有进行演讲或课程来解释这些概念。

React 的概念混乱

React 似乎存在“概念混乱”,向 hooks 的过渡是最有力的例子,但不是唯一的例子。 hooks 的使用有一个很大的区别,它是基于反应性的,尽管 React 核心团队开玩笑说反应性,但他们决定切换到它。

功能组件非常适合它。每次重新渲染都会再次调用该函数,并且内部的所有内容都会获取状态和道具当前版本,因此,内部创建的所有内容都表现得像派生。回报,JSX,是UI的衍生。

但是 React 并不是函数式编程和反应性的完美和纯粹的实现。它以概念和想法为灵感,并将它们融合起来创建自己的模型,但无论如何,核心就在那里。

这一点需要明确。即使不是反应性的示例,它也使用了它们的概念,并且更深入地了解这些模式使开发人员可以轻松地使用这些原语思考和创建解决方案。顺便说一句,这就是我写这个“React 中的反应性”系列的原因。

不仅仅是对用户说,“不要在 useEffect 上同步状态,这很糟糕”,而是解释为什么它很糟糕,以及如何以“同步状态”甚至是第一个解决方案的方式思考。

缺乏一些原语

这一原因正在得到改善,尤其是在 React 19 中。异步派生是使用 useEffect 的原因之一,但现在我们必须使用原语,它在某些方面填补了这一空白。

当然,我们在原语中仍然存在一些弱点,例如动态派生的情况和其他情况,但是越来越多的 React 将更多的副作用移出了 hooks 字段,就像 ref 回调的情况一样。

我们总是可以期待未来的消息。我邀请大家阅读React中所有其他Reactivity的帖子,并带来具体的案例和问题,我们可以探索并找到这些常见反应性问题的更多解决方案。

相关专题

更多
go语言 面向对象
go语言 面向对象

本专题整合了go语言面向对象相关内容,阅读专题下面的文章了解更多详细内容。

55

2025.09.05

java面向对象
java面向对象

本专题整合了java面向对象相关内容,阅读专题下面的文章了解更多详细内容。

49

2025.11.27

PHP 表单处理与文件上传安全实战
PHP 表单处理与文件上传安全实战

本专题聚焦 PHP 在表单处理与文件上传场景中的实战与安全问题,系统讲解表单数据获取与校验、XSS 与 CSRF 防护、文件类型与大小限制、上传目录安全配置、恶意文件识别以及常见安全漏洞的防范策略。通过贴近真实业务的案例,帮助学习者掌握 安全、规范地处理用户输入与文件上传的完整开发流程。

5

2026.01.13

PPT交互图表教程大全
PPT交互图表教程大全

本专题整合了PPT交互图表相关教程汇总,阅读专题下面的文章了解更多详细内容。

51

2026.01.12

Java 项目构建与依赖管理(Maven / Gradle)
Java 项目构建与依赖管理(Maven / Gradle)

本专题系统讲解 Java 项目构建与依赖管理的完整体系,重点覆盖 Maven 与 Gradle 的核心概念、项目生命周期、依赖冲突解决、多模块项目管理、构建加速与版本发布规范。通过真实项目结构示例,帮助学习者掌握 从零搭建、维护到发布 Java 工程的标准化流程,提升在实际团队开发中的工程能力与协作效率。

21

2026.01.12

c++主流开发框架汇总
c++主流开发框架汇总

本专题整合了c++开发框架推荐,阅读专题下面的文章了解更多详细内容。

135

2026.01.09

c++框架学习教程汇总
c++框架学习教程汇总

本专题整合了c++框架学习教程汇总,阅读专题下面的文章了解更多详细内容。

66

2026.01.09

学python好用的网站推荐
学python好用的网站推荐

本专题整合了python学习教程汇总,阅读专题下面的文章了解更多详细内容。

140

2026.01.09

学python网站汇总
学python网站汇总

本专题整合了学python网站汇总,阅读专题下面的文章了解更多详细内容。

13

2026.01.09

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
PHP新手语法线上课程教学
PHP新手语法线上课程教学

共13课时 | 0.8万人学习

光速学会docker容器
光速学会docker容器

共33课时 | 1.9万人学习

时间管理,自律给我自由
时间管理,自律给我自由

共5课时 | 0.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号