如何解析react final形式中的未触及字段

Question

我有一个以react final形式输入的量。如果没有填充，我需要将其表单值设置为零。我不能将初始值传递给它，就好像它还没有被用户填充一样，输入本身应该保持为空。

在react最终表单文档中有一个解析函数。但它只有在字段被触摸(填充后由用户清除(时才起作用。有没有任何方法可以解析未被修改的字段，并在不更新输入的情况下将它们的形式值设置为零？

这是我的代码：

<Field
name="amount"
component={CurrencyInput}
parse={value => (value ? value : 0)}
/> 

这是我的代码沙盒的链接。

Answer 1

如果通过这样做，您试图实现的是当输入为空时，<pre>中显示的对象的默认值为零，则可以使用状态变量，并在parse中不断更新其值

const [amount, setAmount] = useState(0);
const onInputChange = e => {
e === "" || e === undefined ? setAmount(0) : setAmount(e);
};

并且在Field标签中

<Field
name="amount"
component={CurrencyInput}
parse={value => onInputChange(value)}
defaultValue={amount}
/>

在这里检查代码沙盒：

https://codesandbox.io/s/react-final-form-wreact-number-format-and-parse-22q3n

希望这能解决问题