Antd Form中的shouldUpdate与dependencies的区别

896 阅读1分钟

dependencies

dependencies的使用情况是当其中B表单项依赖A表单项的变化而变化的时候使用,并且B表单项的节点是一直存在文档流中的;

shouldUpdate

shouldUpdate可以直接设为true,此时对应的表单里的任意表单项更改,都会重新渲染;如果像根据一定的条件来更新,则可以给shouldUpdate传一个函数,如下所示,只有当函数返回值为true时表单项才会更新;

<Form.Item shouldUpdate={(prevValues, curValues) => prevValues.additional !== curValues.additional}>
  {() => {
    return (
      <Form.Item name="other">
        <Input />
      </Form.Item>
    );
  }}
</Form.Item>

当shouldUpdate的函数是根据某一个表单项的值变化而返回true,此时是和dependencies类似的;

唯一的不同是

shouldUpdate:在某些特定情况下,例如当出现一个新的字段选项并更改了字段值时,或者您只是希望通过表单更新保持某些区域的更新,您可以修改form的更新逻辑;比如存在某些表单项的存在与否是根据某个表单项的值,此时使用shouldUpdate函数的形式判断才能失效

总结

其实,表单仅通过增量更新更新已修改的字段相关组件,以实现性能优化。在大多数情况下,您只需要编写代码或使用dependencies属性进行验证。在某些特定情况下,例如当出现一个新的字段选项并更改了字段值时,或者您只是希望通过表单更新保持某些区域的更新,您可以修改form的更新逻辑。项通过shoulupdate。