Recoil API手册--<RecoilRoot />

<RecoilRoot …props />

Provides the context in which atoms have values. Must be an ancestor of any component that uses any Recoil hooks. Multiple roots may co-exist; atoms will have distinct values within each root. If they are nested, the innermost root will completely mask any outer roots.
为atoms提供上下文。必须是所有是使用Recoil hooks组建的根组建,多个根组建也许可以共存,atoms需要对不同的根组建进行区别。如果它们是嵌套的,最里面的根将完全掩盖任何外部根。
Props:
initializeState?: (MutableSnapshot => void)
An optional function that takes a MutableSnapshot to initialize the atom state. This sets up the state for the initial render and is not intended for subsequent state changes or async initialization. Use hooks such as useSetRecoilState() or useRecoilCallback() for async state changes.
通过一个可选函数来初始化根RecoilRoot组建的atom状态。这将设置初始呈现的状态,而不是用于后续状态更改或异步初始化。利用hooks函数如useSetRecoilState()或者useRecoilCallback()实现异步更新状态。

<RecoilRoot>'s represent independent providers/stores of atom state. Note that caches, such as selector caches, may be shared across roots. Selector evaluations must be idempotent except for caching or logging, so this should not be a problem, but may be observable or may cause redundant queries to be cached across roots.
组建是atom状态的独立的Provider/store.请注意,缓存(如选择器缓存)可以跨根共享。选择器求值必须是幂等的(除了缓存或日志记录),所以这应该不是问题,但可能是可观察的,或者可能导致在根之间缓存冗余查询。

例子

1
2
3
4
5
6
7
8
9
import {RecoilRoot} from 'recoil';

function AppRoot() {
return (
<RecoilRoot>
<ComponentThatUsesRecoil />
</RecoilRoot>
);
}
  • 版权声明: 本博客所有文章除特别声明外,著作权归作者所有。转载请注明出处!
  • Copyrights © 2015-2022 Lee
  • 访问人数: | 浏览次数:

请我喝杯咖啡吧~

支付宝
微信