跳到主要内容

useEntityChange()

function useEntityChange<T>(entity, options?): EntityChangeResource<T>;

Defined in: rxdb-react/src/use-entity-change.ts:102

把实体的 patch 流桥接到 React 渲染,让原地修改能实时反映到视图。

Type Parameters​

Type ParameterDescription
T extends unknown实体实例类型

Parameters​

ParameterTypeDescription
entityT | undefined要监听的实体实例;为 undefined 时不建立订阅
optionsEntityChangeOptions见 EntityChangeOptions

Returns​

EntityChangeResource<T>

见 EntityChangeResource

Throws​

RxDBError 传入的不是已挂载的 RxDB 实体实例时,由 getEntityStatus 抛出

Example​

// 输入停止 200ms 后才重渲染
const live = useEntityChange(todo, { debounceTime: 200 });

return <div>{live.value?.title}</div>;

Remarks​

实体是原地可变的类实例,React 看不到它们的字段变化。编辑中的实体需要在多处实时预览时, 用这个 hook 把 patches$ 接进渲染依赖。

patches$ 带 shareReplay(1):订阅时如果该实体此前已有 patch,会立即收到一次 重放,因此 revision 可能在挂载后马上变成 1。

订阅随组件卸载自动清理;实体或时间窗变化时先退订旧订阅再重建。 revision 跨实体切换继续累加(与 Vue 侧一致),只有 error 会复位。

三端等价实现:Angular 的 RxDBEntityChangeDirective(OnPush 视图用 markForCheck)、 Vue 的 useEntityChange(shallowRef + triggerRef)。时间窗判定共用 @aiao/utils 的 withTimeWindows,三端语义完全一致。