问题标签 [use-ref]

为什么swiss undefined在 this中引用setInterval？

在每次迭代中，swiss都会传入 的值。

我正在开发一个 React JS 项目。我正在使用钩子和功能组件。我正在使用参考。我使用 useRef 是因为我在一个功能组件中。但是 contains 函数不适用于 ref。以下是我的代码。

正如您在我的组件中看到的那样，在事件侦听器中，它引发了以下错误。

我的代码有什么问题？

考虑代码：

你的控制台输出是什么？我认为应该是： valRef_Current 1 valRef_Current 2 valRef_Current 3 valRef_Current 4

但真正的输出是： valRef_Current 1 valRef_Current 1 valRef_Current 2 valRef_Current 3

谁能帮我理解为什么？

提前致谢

我正在尝试创建位置跟踪器的简单示例，但我遇到了以下情况。我的基本目标是通过按开始/结束按钮来切换位置手表。我通过实现自定义反应钩子来分离关注点，然后在 App 组件中使用它：

使用WatchLocation.js

应用程序.js

我搜索了多个在线示例，上面的代码应该可以工作。但问题是当按下停止按钮时，即使我调用Geolocation.clearWatch(watchId) ，位置仍然会不断更新。

我包装了 Geolocation 调用以处理位置许可和其他可能的调试内容。似乎使用useWatchLocation中的useRef挂钩保存的watchId值无效。我的猜测是基于尝试在 Geolocation.clearWatch(watchId) 之后立即调用Geolocation.stopObserving( )。订阅停止，但我收到警告：

使用现有订阅调用 stopObserving。

所以我假设原始订阅没有被清除。

我错过了什么/做错了什么？

编辑：我想出了解决方案。但是由于 isMounted 模式通常被认为是反模式：有没有人有更好的解决方案？

我正在尝试使用实验性的新 React 功能Suspense 进行数据获取。

这是我的简单useApi钩子（如果我正确理解 Suspense 的话）要么返回fetch调用结果，要么抛出吊杆承诺。（稍微修改了记录的示例）

我正在使用这个钩子，就像这样：

它永远不会解决。

我认为问题在于它useRef并没有像预期的那样工作。

如果我用随机值初始化 ref，它不会保留该值，而是用另一个随机值重新初始化：

抛出suspender会导致useRef每次调用都重新初始化，这有点奇怪。

如果我删除该行useRef按预期工作，但显然 Suspense 不起作用。

我可以使它工作的另一种方法是，如果我在 React 之外使用某种自定义缓存，例如：

这也使它工作，但我宁愿使用 React 本身在缓存组件特定数据方面提供的东西。

我是否遗漏了一些关于useRef应该如何使用或不应该使用 Suspense 的内容？

复制：https ://codesandbox.io/s/falling-paper-shps2

我为圆形 svg 上的动画创建了一个参考：

在 a 中useEffect，我有这行代码会产生错误：

这是产生的错误消息：

关于为什么会发生这种情况的任何想法？对我来说似乎是打字错误，但我可能是错的

我有很多照片缩略图，当列表加载时，我应该能够将其中一个缩略图滚动到视图中。

照片填充有map功能，缩略图的容器 div 之一将给出ref。

我试过useEffect：

问题是ref或者ref.current不能用作useEffect的依赖列表。我收到警告：

React Hook useEffect 有一个不必要的依赖：'scrollRef.current'。排除它或删除依赖数组。像'scrollRef.current'这样的可变值不是有效的依赖关系，因为改变它们不会重新渲染组件

更改时如何触发 useEffect 或其他功能ref.current？我所说的变化是指它的 clientHeight 值变化。因为最初它为零，并且scrollIntoView还不起作用。

我想在搜索组件中进行特定的计算。为此，我必须将在 Header 组件中获得的 buttonSearchRefOffsetLeftValue 传递给 Search 组件。我在标题中获得了所需的值。但是，在 Search 组件中，它总是未定义。无法理解这种行为。

我正在尝试使用 React.js 中的功能组件来操作 DOM。当我将鼠标悬停在浮动方块上时，我希望浮动方块旋转一定度数，并尝试在我的 handleCursor 函数中操纵 DOM 中的元素。该样式表示它正在右侧的 console.logs 上进行更新，所以我不确定为什么实际的正方形本身不进行旋转。

我想要的内容显示在此 codepen 链接中：https ://codepen.io/rauldronca/pen/MZjEBd

这是一些JS代码

此外，我也尝试使用 useRef 挂钩，但它与我的 handleCursor 函数做同样的事情。方块仍然不会旋转（我注释掉了我的 useRefs 代码）

对于我的基于 React 钩子的组件（我正在使用 Ant 设计框架），我有大量的表单输入。我的要求是，每当用户尝试在不遵守表单验证规则的情况下提交表单时，焦点将滚动到出现此类错误情况的第一个输入元素。这是我的表格的样子，

为简单起见，我只是从整个表单中添加了三个字段，您可以看到每个字段都有此验证。现在我的问题是，当用户填写该字段并向上滚动到该字段时如何识别特定字段？这是我正在检查表单是否有错误的函数，

我想从上面的函数中识别出第一个错误元素并将这个元素聚焦。因此，我根据元素 id 设置状态，例如，

然后我做了一个 useEffect 调用，例如，

但是控件不会滚动到该特定元素。我知道，我可以使用 useRef。但是如何通过我的isDataValid函数为这些元素动态设置引用？我的表单组件还包含嵌套组件。useRef 是否足以捕获嵌套组件的错误场景。

非常感谢任何解决此问题的想法。