使用 useRef 钩子进行滚动检测导致重新渲染

[英]Using useRef hook for scroll detection causing re-rendering

我在布局组件中使用 useRef 挂钩来检测其子项（pageContent）的滚动值。 然后我有条件地显示一个按钮以滚动回顶部。 功能正常工作，但是当我在 pageComponent 子项 ( <route.component/> ) 中 console.log 时，它告诉我每次按钮显示 ...

出现错误“函数组件不能有字符串引用。我们建议改用 useRef()。” React Native Expo App 尽管我使用的是 useRef

[英]getting Error "Function components cannot have string refs. We recommend using useRef() instead." React Native Expo App Although i am using useRef

I am getting this error 错误：Function 组件不能有字符串引用。 我们建议改用 useRef()。 在此处了解有关安全使用 refs 的更多信息： https://reactjs.org/link/strict-mode-string-ref 这个错误位于：在RCTV ...

使用 ref 解决 typescript - “No matches overload call”

[英]Solve the typescript - "No matches overload call" with ref

我去解决typescript通讯员。 这是代码和我得到的错误。 这是我现在得到的错误。 让 navCurrent: HTMLElement | null 没有与此调用匹配的过载。 重载 1 of 4，'(iterable: Iterable | ArrayLike): HTMLAnchorEle ...

为什么 React 不在我的模式中取消设置表单输入中的值？

[英]Why is React not unsetting the value in the form input in my modal?

我正在使用 Next 和 Tailwind/Daisy UI。 下面页面的代码将从 API 端点获取 JSON object 并呈现源系统的顶层表和附加域的下层表。 单击顶部表格中的一行会将第二个表格过滤到相关域。 这一切都很好。 我还有一个模态将用于创建新的源系统或编辑现有的。 [Edit] ...

为什么我的 useEffect 在 localhost 上运行但在生产环境中不起作用？

[英]Why my useEffect is working on localhost but not in production?

我在我的 app.jsx 中使用以下逻辑来检查 accessToken，如果不存在，那么我想运行 useRefreshToken 突变以借助存储为 httpOnly 和安全标志的存储的 refreshToken cookie 获取新的 accessToken。 我在我的开发中成功运行了代码，并且所 ...

为什么我的组件引用在测试期间总是未定义

[英]Why is my component ref always undefined during test

我有一个容器元素，在其中呈现一堆按钮组件。 我试图实现的要求之一是，如果只呈现一个按钮，我希望它被禁用。 现在，确定将在容器中呈现多少个按钮的逻辑非常复杂，所以我不能只检查列表的length来确定它。 所以我想我会很有创意，并使用一个 ref 来检查容器有多少个孩子来确定是否应该禁用里面的按钮： 简 ...

将鼠标悬停在每个链接上时，React 中的自定义 cursor 应该更改

[英]Custom cursor in React should change when hovering over every link

我正在尝试在 React 中创建自定义 cursor，并希望 cursor 在悬停在页面上的任何链接上时改变外观。 我可以通过使用 ref 使它在特定的单个链接上工作，如下所示： <a href="#" ref={myLink}>My link</a> 然后使用它来附加事件处 ...

在 function 中使用 useEffect()

[英]Using `useEffect()` inside of a function

我在FlyerChat中遇到了以下代码。import * as React from 'react' export const usePrevious = <T>(value: T) => { const ref = React.useRef<T>() R ...

输入'MutableRefObject<undefined> ' 不可分配给类型 'LegacyRef<htmldivelement> | 不明确的'</htmldivelement></undefined>

[英]Type 'MutableRefObject<undefined>' is not assignable to type 'LegacyRef<HTMLDivElement> | undefined'

我已经设置了一个自定义挂钩，它获取一个ref object 并观察它： 接下来，在我的页面组件中，我使用useRef()声明了一个ref ： 这给出了以下错误： 关于这个错误的奇怪事实是，虽然这在我的编辑器中给出了一个错误，但代码仍然按预期工作。 我尝试将 ref object 的类型设置为Leg ...

如何使用 useRef 和 TypeScript 键入变量

[英]How to type a variable with useRef with TypeScript

我使用useRef()来处理输入中的电话号码错误。 我这样做： 稍后在代码中，我使用errorPhoneDiv.current.innerText设置书面电话号码，但 TS 告诉我： 类型“{}”上不存在属性“innerText” 我应该将什么类型传递给MutableRefObject以接受useR ...

Typescript 另一个 Ref 的 Ref - 类型上不存在属性

[英]Typescript Ref of another Ref - Property does not on exist on type

我正在使用https://github.com/lhz516/react-h5-audio-player并且我试图在不使用useRef&lt;any&gt;(null)的情况下正确声明我的useRef类型。 我可以使用以下方法访问和更新音频元素（功能是当您单击相应的文本转录时将录音移动到一个部分）。 ...

拖放不适用于 useFieldArray 中的嵌套数组

[英]Drag-and-drop not working for nested array in useFieldArray

我正在尝试在嵌套的输入数组上实现拖放功能。 我正在使用react-beautiful-dnd和react-hook-form库： useFieldArray挂钩管理表单， useController挂钩控制输入。 我面临的问题是当我尝试重新排序任何子输入时，更改仅发生在最后一项。 这是一个沙箱。 要 ...

如何使播放列表在反应音乐播放器中连续播放

[英]How to make a playlist to play continuously in react music palyer

我是新手，所以不要太苛刻。 我正在构建音乐播放器，但我还剩下最后一件事 - 我不知道如何在当前歌曲结束后播放下一首歌曲。 这是我的代码 这是负责播放一般音乐的代码的一部分。 我试图实现这个功能，但首先我需要弄清楚如何理解当前曲目已完成。 （此功能与 nextTrack 按钮配合使用时效果很好） 先 ...

反应 | 收集子数组的状态值并更新每个对象并保存到 PouchDB

[英]React | Collect State Values of Children Array and update Per Object and Save to PouchDB

堆栈溢出问题我有单独的组件来存放Tiptap 编辑器表。 起初我为每个子组件都有一个保存按钮，它工作正常，但对用户不友好。 我想要一个统一的保存按钮，它将遍历每个子 Table 组件并将它们的所有editor.getJSON()数据汇集到单个doc object的sections数组中。 然后通过 ...

如何通过 useRef 钩子使用样式？

[英]How to use styling with useRef hook?

我正在尝试使用 useRef 通过单击按钮来移动组件的项目。 我尝试了以下代码： 我收到错误消息“类型错误：无法读取 null 的属性（读取‘样式’）”。 useRef 的正确使用方法是什么？ ...

当道具在 React 的模态中发生变化时，如何避免重新渲染？

[英]How can I avoid re-render when props change in a modal in React?

我有个问题。 我想在反应模式中放置一个表单，当用户单击按钮接受将数据提交到给定的 url 时。但我希望模式足够通用以包装许多 forms 但这样做模式必须接收一些参数每次参数更改时，模态都会重新呈现。 我创建了一个自定义挂钩，用于返回表单和从表单中提取的数据。 然后我将表单作为模态组件的子项传递， ...

如何在 useRef 中使用 preventDefault function (reactjs + nodejs)

[英]How to use preventDefault function in useRef (reactjs + nodejs)

这是我的 function 下载 zip 文件 autoDownload.current.click() - 自动点击 HTML 元素下载我的 zip 文件。 但问题是页面用于在此过程中重新加载。 我怎样才能防止我的页面重新加载。 我需要这样的东西。 ...

使用 Refs 数组而不是单个 Ref

[英]Using array of Refs intead of single Ref

我在地图循环中使用 ref。 我需要一个 refs 数组问题是 ref 只针对列表中生成的最后一个元素这里是我准备的示例，我需要通过 ref 列表在 map 循环内的所有生成元素上运行自定义挂钩我正在寻找一种不引入另一个组件的方法 codesandbox 的链接在这里https://codesa ...

使用 CSS 在 React js 中的页面部分之间切换

[英]Toggling between sections of a page in React js with CSS

我正在使用 React 构建一个应用程序，当单击某些按钮而不更改路由时，它会显示/隐藏页面的各个部分。 我更喜欢用更短的方式来做这件事，因为我仍然会在应用程序的后面部分做更多这样的事情。 下面是我的实现。 下面是我的实现。 ...

我们可以渲染存储在 ReactJs 的 useRef 变量中的 div 引用吗

[英]can we render div reference stored in useRef variable in ReactJs

实际上我正在尝试创建一个弹出窗口，当用户单击特定元素的展开视图时，它允许用户在弹出窗口中看到展开的视图有一系列不止一个元素要求：-问题是有多个元素，无论何时单击该元素，它都应该在弹出窗口中打开。 你可以把它想象成一个联系人网格，每当你点击任何一个联系人时，它应该在弹出窗口中查看我目前的方法：- 当用 ...