我想在某处存储我的 React Final Form 的状态。现在它在 React Hook 中。我目前正在使用useMethods，类似于useState.
我目前拥有的表单是一个多步骤过程的一部分，当我导航到另一个没有该表单的页面时，它会被卸载（当然）。重新安装时，我想为表单提供初始值（可在此处获得）。
问题是，当我的状态改变时，表单会重新渲染并且我总是以无限循环结束，因为：
FormSpy专卖店的形式变化FormSpy专卖店的形式变化我还有一个问题，当提供初始值时，字段状态未填充（脏、触摸等），因此重新安装时表单看起来很奇怪，因为某些标签与元字段相关联。似乎我们需要某种方式来存储所有表单状态，而不仅仅是作为包含Form可以卸载和重新安装n次的组件的值。
我想要的是：
我的出发点是查看使用去抖动自动保存（尽管我不需要去抖动，因为我将它存储在本地）。
处理这个问题的最佳方法是什么？
我刚刚遇到了类似的问题，并设法创建了一个装饰器，该装饰器可以记住已触摸（或任何其他字段状态），然后在再次安装该字段时重新应用该状态。一个主要问题是，这会导致闪烁，因为该字段在装载时没有被渲染，然后装饰器被通知，然后该字段被渲染。
一些示例代码（未测试）：
function decorator(form) {
const storedTouched = {};
return form.subscribe(({touched}) => {
for(const field of Object.keys(touched)) {
if(touched[field]) {
storedTouched[field] = true;
}
}
for(const field of Object.keys(storedTouched)){
if(touched[field] === false) { // check against false since unregistered fields are undefined
form.mutators.setFieldTouched(field, true);
}
}
}, {touched: true});
}
您还可以公开storedTouched以允许设置任何触摸的字段，而不仅仅是那些已经安装/注册的字段。（例如将其初始化为上次已触及的字段）