React 绑定层与渲染策略 ​

1. 组件分工 ​

• FormProvider：注入 Form 上下文。
• Field/ArrayField/ObjectField/VoidField：创建并挂载 core 字段模型。
• ReactiveField：读取字段状态并渲染 decorator/component。
• SchemaField：Schema 入口（支持 Markup 与 JSON Schema 两模式）。
• RecursionField：递归渲染 schema 树。

2. 渲染核心逻辑（ReactiveField） ​

ReactiveField 做了三件关键事：

1. 根据 field.display 决定是否渲染；
2. 将 field.componentProps/decoratorProps 注入对应组件；
3. 把 onChange/onFocus/onBlur 事件桥接到 field.onInput/onFocus/onBlur。

因此 React 组件只是“视图投影”，真实业务状态都在 field model。

3. 精准重渲染的来源 ​

• 组件被 observer 包裹（来自 @formily/reactive-react）。
• useObserver + Tracker 只追踪 render 中读取到的字段状态。
• 某个字段属性变化，仅订阅该属性的组件更新。

这就是 Formily 高频思考题“为什么不是整表重渲染”的底层答案。

4. React 18/19 兼容点 ​

在 reactive-react 中可见：

• useCompatFactory 对 StrictMode/Concurrent 场景做 GC 兜底；
• 防止异常生命周期路径下 reaction 泄漏。

社区演进也有对应修复信号：

• React 环境渲染兼容修复：#4308

5. connect/mapProps/mapReadPretty 的价值 ​

connect 提供“业务组件无侵入接入 field model”的方式：

• mapProps：字段状态映射到组件 props（如 value -> checked）。
• mapReadPretty：在 readPretty 模式切换到只读组件。

这是 Formily 可复用组件生态（antd/next/element）的基础能力。

6. SchemaField 的设计亮点 ​

• 支持 Markup DSL 与 JSON Schema 混合。
• 支持 ExpressionScope 注入表达式上下文。
• 支持 x-slot-node 场景（复杂 prop/render-prop 注入）。

这让 Schema 渲染不是“死配置”，而是具备可组合表达力。

7. 总结 ​

“Formily 的 React 层非常薄：负责上下文、递归渲染与事件桥接；
状态和联动全部在 core/reactive 层完成。
这使得 React 层能做到精细重渲染，同时保持复杂业务逻辑可测试、可迁移。”