无法将 'touched' 设置为 true

Question

我只是想创建一个自定义 Formik <Field />。它是<input type = file /> opacity=0 并且取决于values我的<Error />组件样式和<input type = text />. values.photo没关系。问题是 touch 永远不会成为真的，所以我无法展示我的<Error />组件。你能解释一下出了什么问题吗？ https://codesandbox.io/s/purple-violet-qgxr3?file=/src/components/FileInput.js

Answer 1

在您的文件输入组件中添加以下内容：

form.setTouched({...form.touched,[field.name]: true });

setTouched 取字段对象，field.name是文件输入名称。

Answer 2

当您通过侦听 onChange 事件来处理文件输入时。一旦调用了 onChange 方法，您就可以通过调用 .markAsTouched()将您的字段标记为已触摸，以便在验证条件时显示错误。