atnd中Form的useWatch方法
在antd 4之后,在处理表单之间的联动关系时,我们可以使用useWatch,简单看一下它的具体实现
我们先看一下useWatch.ts
我们把上面的代码再精简一下
我们再来看一看registerWatch,notifyWatch以及使用到notifyWatch的updateValue等方法
整个流程就是,registerWatch将callback放到watchList中,在setFields、resetFields以及rc-field-form内部的updateValue方法中均会通过调用notifyWatch去执行所有的callback。而在这些调用notifyWatch的地方,都会先更新store,这样notifyWatch中才能获取到最新的value,然后传递给callback。useWatch中registerWatch传入的callback函数,则会判断新旧value是否一致,然后再去setValue,触发更新,渲染页面。
这种方式效果其实和antd3类似,只要我们watch的field值发生变化,当前的整个组件都会重新渲染。
