将数组传递给 useEffect 依赖项列表

2023-11-30

每 5 秒长轮询会产生一些数据,我希望我的组件在每次数组的一项(或数组长度本身)发生变化时调度一个操作。 在将数组作为依赖项传递给 useEffect 时,如何防止 useEffect 进入无限循环,但如果任何值发生变化,仍然设法调度一些操作?

useEffect(() => {
  console.log(outcomes)
}, [outcomes])

where outcomes是一个 ID 数组,例如[123, 234, 3212]。数组中的项目可能会被替换或删除,因此数组的总长度可能(但不必)保持不变,因此传递outcomes.length因为依赖性并非如此。

outcomes来自reselect的自定义选择器:

const getOutcomes = createSelector(
  someData,
  data => data.map(({ outcomeId }) => outcomeId)
)

你可以通过JSON.stringify(outcomes)作为依赖列表:

阅读更多here

useEffect(() => {
  console.log(outcomes)
}, [JSON.stringify(outcomes)])
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将数组传递给 useEffect 依赖项列表 的相关文章

  • 如何在reactjs中访问悬停状态?

    我有一个侧面导航 里面有很多篮球队 因此 当其中一个团队悬停在上方时 我想为每个团队显示不同的内容 另外 我正在使用 Reactjs 所以如果我可以有一个可以传递给另一个组件的变量 那就太棒了 React 组件在其顶级界面中公开所有标准 J
  • 自定义rc-time-picker的样式

    我在用rc time picker我的项目的包 但我在自定义样式时遇到问题pop up of my time picker成分 这是我的组件的屏幕截图 首先 我需要更改时间的背景颜色item在当时li from light grey 在屏幕
  • 当文本输入聚焦在 React Native for Android 的底部工作表上时,视图移出屏幕

    我正在使用图书馆 https github com osdnk react native reanimated bottom sheet https github com osdnk react native reanimated bott
  • 代码镜像错误:未捕获错误:扩展集中无法识别扩展值([对象对象])

    全部 我目前正在从事一个React Electron项目 该项目的目标是完成一个Markdown编辑器 当我配置codemirror 该程序报告错误说 Uncaught Error Unrecognized extension value
  • 如何在执行新操作时取消先前操作的执行?

    我有一个动作创建器 它会进行昂贵的计算 并在每次用户输入内容时调度一个动作 基本上是实时更新 但是 如果用户输入多个内容 我不希望之前昂贵的计算完全运行 理想情况下 我希望能够取消执行先前的计算并只执行当前的计算 没有内置功能可以取消Pro
  • 如何将 SPA 嵌入 ASP.NET Core 库并从路径提供服务

    Szenario 我想构建一个 aspnetcore 库 模块includes一个小的SPA前端 IE html js css 文件应与 dll 一起提供 SPA 应从特定路径提供服务 即 some module does not需要可配置
  • redux 是否会在对存储进行任何更新时评估存储的所有侦听器?

    据我所知 当商店中的任何内容发生变化时 redux 都会通知商店的所有订阅者 无论是对深层嵌套叶子的订阅还是对状态顶层的订阅 在您遵循指导原则的应用程序中 许多单独的组件应该连接到商店 而不是仅仅几个 docs https redux js
  • React Typescript - 在路由中传递时如何将类型添加到 location.state

    当我将react router props发送到路由中的组件时 我收到错误 因为我有特定的状态 我传递了该组件 但错误显示在我的路由中 这是路线代码
  • 如何在appendchild方法javascript或reactjs中使用文件夹路径中的svg?

    我是 ReactJS 的新手 我坚持将 svg 元素附加到 div 元素 我想实现什么 我有一个动态创建的 div 元素 如下所示 constructor props super props this element document cr
  • 在复选框内映射复选框 ReactJS

    我有一个函数 一旦主复选框被选中 就会触发子复选框 并且所有这些复选框都是从 JSON 映射的 主复选框 最高级别 及其下面的所有子复选框 第二级别 都会在单击时显示 并且效果很好 我想要显示的是单击时主复选框 第三级别 的子复选框2 级项
  • useState 以 `new` 关键字作为参数

    我正在构建一个单独的服务来处理复杂的事情 该服务是一个类 只是为了测试建议 我在一个内部模拟useState 重点是我忘记了一个console log在构造函数内部 并意识到类构造函数在组件重新渲染时被调用多次 这种行为不会导致意外的行为或
  • Redux 状态 - 最大推荐大小

    我正在构建一个项目管理应用程序 但我仍然在努力解决一个问题 在 Redux 状态中存储什么以及 按需 加载什么 Redux 状态是否有已知的 最大推荐大小 几十千字节 几百千字节 兆字节单位 请记住 归根结底 Redux 只是 如何 将信息
  • Typescript 和 React:在组件之间传递 props 与默认 props

    我对 Typescript 和使用 Typescript 创建 React 应用程序相当陌生 我在将道具从一个组件传递到另一个组件时遇到了一些麻烦 我在下面提供了一个示例 我的问题是围绕组件的默认道具 当我在父组件中调用子组件时 出现错误
  • 将 useRef 挂钩传递给 ref 属性的正确方法

    我不确定如何更明确地提出这个问题 但它是关于值传递 and 引用传递反应中的情况 还有胡克斯 我正在使用 gsap 来制作 div 滑入和滑出的动画 这是其上下文 但我猜测 ref 的用途并不重要 因此 这工作得很好 尽管这是一种更典型的类
  • 设计 React Hooks 可防止 React-hooks/exhaustive-deps 警告

    我正在设计一个钩子 仅当钩子依赖项发生变化时才获取数据 它按预期工作但我收到了 linter 警告 React Hook useEffect was passed a dependency list that is not an array
  • React router.push 和 router.replace 之间的区别?

    有什么区别React 路由器推送 and 路由器 替换 路由器历史记录就像一个stack of routes 当您使用router replace 您将覆盖堆栈的顶部 当使用router push 它在顶部添加了一条新路线stack 路由器
  • 如何测试 google.maps.Geocoder?

    你好 我正在尝试编写一个 简单 测试来检查反应类组件状态更改 具体来说 我正在测试如果 Google 成功对我发送的某些字符串 地址 进行地理编码 lat 纬度 和 lng 经度 状态是否会发生变化 这是我想测试的示例 i e the la
  • React Material UI CardMedia 视频组件未播放

    我看到缩略图 但无法启动或停止视频 还有什么方法可以让它自动播放和重复吗 https material ui com api card media https material ui com api card media
  • 在 webpack 2.x 中使用 autoprefixer 和 postcss

    如何使用autoprefixer使用 webpack 2 x 以前 它曾经是这样的 module loaders test scss loader style css sass postcss postcss gt return autop
  • 如何在 Swiper 实例之外使用 useSwiper?

    我在用着用于 React 的滑动器 https swiperjs com react显示一些幻灯片 我一直坚持使用外部按钮在幻灯片 上一张和下一张 之间导航 刷卡器有一个useSwiper hook https swiperjs com r

随机推荐

  • 将 Jenkins 管道阶段显示为失败,但不会导致整个作业失败

    这是我正在使用的代码 node stage build echo build stage tests echo tests stage end to end tests def e2e build job end to end tests
  • 使用 FCM 在 Apple Safari 中推送通知

    我们在 Chrome 和 Firefox 中使用 FCM 实现了推送通知 并且运行良好 但 Safari 不支持 FCM 强制要求的 Service Workers 有人处理过此类问题吗 有什么建议么 虽然 Service Workers
  • 在Android中捕获自定义列表视图的点击

    我使用了一个自定义 XML 文件来创建将我的数据库游标绑定在 ListActivity 中 XML 文件中的每个项目都有 2 个按钮 我想捕获按钮的点击事件和列表中的位置 这是我的 XML 文件
  • 如何增加 MATLAB 2014b 散点图中图例的标记大小? [复制]

    这个问题在这里已经有答案了 我发现散点图中的标记大小和 MATLAB 2014b 中的图例不同 我搜索并找到了早期版本的 MATLAB 中的一些解决方案 这些解决方案不适用于最新版本 在我当前的版本中 图例中的标记尺寸非常小 几乎无法区分
  • 媒体播放器和播放延迟

    我创建了一个小应用程序 即媒体播放器 我有方法 我有一首歌 我想在单击按钮后延迟播放声音 我怎样才能做到这一点延迟 我想点击按钮 5 秒后音乐就会播放 我在用 MediaPlayer create获取歌曲和mediaplayer start
  • C++ 将派生类 shared_ptr 传递给模板化函数

    首先是应该起作用的东西 然后是不起作用的东西 为什么不是这个问题 我声明两个类 class Base class Derived public Base 然后我在其他地方有以下功能 void foo shared ptr base 下面的代
  • wxpython——线程和窗口事件

    我有一个 wxPython 应用程序 http www OpenSTV org 使用多轮方法计算选票 我想做两件事 1 对于大量选票 这可能有点慢 所以我想向用户显示一个进度对话框 这样他就不会认为应用程序被冻结 2 我想允许用户手动打破平
  • 在 google go 中使用 olivere/elastic 更新 ElasticSearch 中的记录

    我正在使用 go 在弹性搜索中插入一条记录 如下所示 https github com olivere elastic现在 如果我必须部分更新它 假设只有一个条目 如 名称 那么我想使用 UPDATE API 我找不到任何描述如何在 oil
  • JSF RichTable 合并标题中的行/列

    我想做的是做这个布局RichTable在其标题中有 3 列 3 5 1 2 4 6 我已经习惯了this 8 2 完成任务的资源 富脸4 0 0 但相反 我最终得到了没有任何合并的普通表行 您能解释一下吗 Update 关于来自的答案瓦西尔
  • 多个组件 - 性能损失?

    我有一个清单System IO Ports SerialPort一个程序集中的对象 并且我计划处理来自另一个程序集的 Data Receieved 事件 我想知道这是否会以某种方式影响性能 会吗 恐怕我不太清楚 CLR 如何管理程序集 谢谢
  • 从 VS 05 中的资源设置应用程序图标

    我知道我可以将图标添加到项目的 Resources resx 文件中 然后从代码中引用该图标 如何从资源中设置整个EXE的图标 我所看到的只是浏览另一个文件的地方 我想使用我的资源中的当前图标文件 而不必在我的项目中拥有重复的文件 than
  • 如何将两个独立但相似的代码库合并到一个 SVN 代表中?

    I have www example com 上的 var www cool codebase 并且我有 www example net 上的 var www cool codebase 代码库适用于在不同服务器上运行的同一 Web 应用程
  • 将 nil 排序到可选字符串数组的末尾

    如果我有一个可选字符串数组 并且我想以 nils 开头按升序对它进行排序 我可以在一行中轻松完成 b nil a sorted 0 lt 1 nil a b 但似乎没有任何类似简单的解决方案可以将 nil 排序到end数组的 使用大多数其他
  • 是否有 Visual Studio 插件的配置类型文件?

    创建 Visual Studio 加载项时 如何利用该加载项的 app config 如果我向项目添加一个并部署它 那么当加载项运行并且我以编程方式尝试通过 ConfigurationManager AppSettings 访问它时 它不会
  • xargs 在搜索中尊重通配符

    我有一个名为 file1 txt 的文件 dir1 dir2 dir3 我想使用 xargs 检查某些文件是否存在于文件系统中 如下所示 cat file1 txt xargs i ls projects analysis7 meta bw
  • IHttpContextAccessor.HttpContext.User.Identity 显示 CurrentUserService 服务中的所有 null 属性

    我正在尝试使用Jason Taylor 的简洁架构模板 这个模板使用 NSwag 自动创建 TypeScript 客户端 Angular 但我不需要创建 TS 客户端 所以我的主要目标是用 Razor Pages 替换它 我已经能够取得高分
  • Cocoa:每次方法调用都会中断?

    通常 在调试时 了解以什么顺序调用类的哪些方法对我来说很重要 天真的解决方案 到目前为止我一直在使用 是弹出一个NSLog在每个方法的顶部 但这是耗时的 重复的 丑陋的 并且如果我在调试后忘记删除日志 会让我的代码看起来很幼稚 一个更干净的
  • Toast 不从列表中选定的项目生成文本

    我在android中用列表视图制作了一个简单的应用程序 因为我想在选择一个项目时进行吐司 我已经尝试如下 但它不起作用 我的代码如下 main java package com example listview import java ut
  • ZF2 骨架应用程序抛出 500 错误

    当尝试使用以下命令部署骨架应用程序时 git clone git github com zendframework ZendSkeletonApplication git cd ZendSkeletonApplication php com
  • 将数组传递给 useEffect 依赖项列表

    每 5 秒长轮询会产生一些数据 我希望我的组件在每次数组的一项 或数组长度本身 发生变化时调度一个操作 在将数组作为依赖项传递给 useEffect 时 如何防止 useEffect 进入无限循环 但如果任何值发生变化 仍然设法调度一些操作