问题标签 [recoiljs]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
recoiljs - 顺序执行 Recoiljs 状态更新?
有没有办法保证两个反冲状态变化的顺序?就像我有
有没有一种规范的方法来更新 stateOne,然后才更新 stateTwo?两个 setter 都返回 void,所以我不知道何时进行了更新。如果他们回来Promise<void>
了,那么我可以做类似的事情setOne().then(setTwo())
我的用例本质上是我有一个自定义钩子,它将Partial<Foo>
各种道具映射到表示一种Foo
类型的不同原子中,我有一个自定义钩子,它采用Bar extends Foo
并映射Bar
到表示Foo
类型的各种原子加上其他原子(包括一种Bar
类型)。
我需要合并 aBar
然后Foo
写入Bar
原子。最简单的方法是重用我的自定义钩子来编写 Bar 然后应用 Partial 的东西。
否则,我需要编写合并函数,考虑到我们正在处理的实际状态的巨大,这将是,呃,庞大的。(以前的开发者有一个来自后端的对象,它不仅代表业务对象,还代表UI 状态)。我的代码只有业务对象。需要预加载 UI 状态,然后是我的业务对象。
重写提供 UI 状态的代码根本不是一种选择。时间和金钱的限制,以及缺乏做出决定或说服他人的权力。
javascript - 如何更新 Recoil.js 外部组件中的原子(状态)?(反应)
我是 Recoil.js 的新手,我在应用程序中为登录用户提供了以下原子和选择器:
所以基本上我用signedInUserSelector
它来设置新用户。
现在,我想要一些函数来通过选择器设置用户,并在我的组件中使用它们,例如:
问题是因为这些函数没有在组件内部定义,所以我不能使用反冲钩子(比如useRecoilState
访问选择器/原子)。
最后,我希望有任何组件能够做到:
signInWithGoogleAccount
但是,如果它不在组件中,我如何访问选择器/原子?
google-chrome-extension - 如何在 Chrome 上显示 Recoil Extension 的详细值
这是我的 Recoil Extension,我怎样才能看到我的状态
reactjs - 使用 React JS 在电子商务商店中管理商店产品的最佳方法?
我是 React 的初学者,需要一些专家建议来管理 React JS 中的产品,我还需要实现各个领域的过滤。我可以将所有产品存储在状态中并手动执行该过程,或者在每次加载页面并且需要过滤时点击 API。实现两者的最佳方法是什么?
reactjs - 在不触发重新渲染的情况下更新 Recoil 状态
我正在使用 Recoil 来跟踪用户打开的最后选择的手风琴。根据动态生成的工作流程,在页面上呈现的手风琴数量可以在 10 到 250 个手风琴之间变化。
我想知道是否有人知道如何在不触发重新渲染的情况下更新 Recoil atom。如果我使用 useRecoilCallback 更新 Recoil 状态,那么在性能良好的设备上,它仍然需要大约 1 秒或更长时间来注册我的点击并随着渲染进行更改。如果我在设置时删除 Recoil 状态,它会立即呈现并注册点击。
我想知道是否有办法在不导致渲染的情况下更新 SelectedCategories 原子。这些手风琴中的每一个都有 15 多个额外的手风琴组件,当我切换一个时,每个手风琴及其子手风琴都会重新渲染。
javascript - 反冲当原子状态改变时,有没有办法做额外的动作?
我将主题状态作为反冲原子来管理。
如果用户通过 ui 改变主题,对应的 atom 状态也会改变。
我想将此处更改的主题值保存到本地存储。为此,我们需要知道该状态何时发生变化。
当然,你可以在调用对应的 atom 状态改变之前添加 localstorage 存储代码,但是如果在很多地方使用 atom 的话,这样效率太低了。
此时我应该使用选择器吗?但是,由于主题是单个状态,因此将其作为派生状态来扩展状态变化逻辑并不直观。
如果您知道,任何帮助将不胜感激。
示例代码
reactjs - 对一组对象使用 useMemo/React.memo 以防止在编辑其中一个对象后重新渲染的最佳方法?
我正在为我的 React 应用程序的性能问题而苦苦挣扎。例如,我有一张卡片列表,您可以在 Facebook 上添加类似的卡片。一切,一旦其中一个孩子更新,所有列表都会重新呈现,所以在这里我尝试使用 useMemo 或 React.memo。我以为我可以将 React.memo 用于卡片组件,但没有成功。不知道我是否错过了一些重要的部分..
父.js
使用PostLike.js
Child.js
LikeButton.js
这里的主要问题是,当其中一个列表更新时,使用备忘录的最佳方式是什么。记住父组件中的整个列表或每个子列表,或者在子组件中使用 React.memo ......(但想象一下,如果用户编辑它们,其他事情也会改变。例如文本,图像......)我总是看到父组件使用 React 开发工具突出显示。
reactjs - 调用 API 将其存储在原子中 - Recoil
如何调用 API 并将其存储在 atom 中?
API 需要来自组件的参数,所以我使用 selectorFamily。
sourceDetailsStateData 返回一个空对象。如何更新它以便从 API 获得响应?请指教。