关于 IFormComponent/Antd-Form 的理解

主要是对公司封装的表单组件的认识, 其实也是对 Antd-Form 的认识

1. 需要知道 schema 里声明表单控件/ui 组件，推测只有type=ReactNode时，比如 antd 组件，自封装的函数组件时，form 实例才会将其key和其值存入 form.getFieldsValue 里，也只有type = ReactNode时，formItemProps 才有效。但原生标签(包括 Layout)作为**type**时，都不会。

2. 使用 Antd 等各种 input 组件时，Form 组件会自动 劫持其 onChange事件，当 input 改变时，form 组件的 fieldsValue 也会同步改变的。

3. 在使用自定义组件插入 Form 组件时，只需要 在该组件对应的节点上，调用 props.onChange(value)。即可把该组件的值同步至 form 组件的 fieldsValue 里，还有就是在普通 Input 组件外包裹 Form.Item并设置 name 也可以。

4. setSchema 设置(自定义)子组件(FormItem 下的 widget) props时，该子组件的 被设置的 props 必须使用 **useEffect **将其添加为依赖。因为 **setSchema **修改 props 引发的副作用是在子组件挂载后才执行的。所以需要使用 **useEffect **监听 依赖的props的变化，来响应 **setSchema **的设置。

// 如改依赖只想触发一次。打一个 Ref即可。
useEffect(() => {
  if (Array.isArray(props?.defaultList) && flag.current) {
    setStateWrap({ numberList: props?.defaultList });
    props?.onChange(props?.defaultList);
    flag.current = false;
  }
}, [props?.defaultList]);

5. **form.resetFields **会引发 Form 组件重新渲染, 内部每个 input 都会重新跑 useEffect，所以在使用modal且配置 **destroyOnClose 时, **就不要在 组件挂载时调用 **form.resetFields **了，这样会导致多余请求和重复无意义的渲染。因为modal的 **destroyOnClose **属性，会在modal关闭时就销毁内部组件，所以没必要再调用 ** form.resetFields **重置表单了。
6. 监听**form.List**的 name 不能用 watch 的回调参数，会有问题，使用 form.getFieldValue 替换即可