Reactjs React-Formik：显示错误（1）在提交时单击，以及（2）在模糊/更改时使用'；触摸'；

在Formik中，我需要在两种情况下都显示验证错误：

在更改/模糊时，在表单上触及字段时单独进行——在填写过程中，并非一次全部

在任何时候点击提交：此处，所有错误应立即显示

（1） 正在工作，但（2）不工作。当我来到表单并单击Submit按钮时，不会发生任何事情，也不会显示错误。只有当我触摸控件时才会显示错误

我认为问题在于，为了满足（1），我的控件

isInvalid={touched.startDate && errors.startDate}  

但当我单击“立即提交”时，控件还没有被触动，因此此

isInvalid

条件失败。但是我不能删除被触摸的.startDate部分，因为否则，所有无效控件都会在填写表单时开始显示，即使是我没有被触摸过的控件。填写时，我需要触摸我的

要求，但也要在提交时显示所有错误。提交是一种必须同时显示所有错误的情况。是否可以将一些
submitClicked
变量传递到某个地方以实现此目的

<Formik enableReinitialize 
        validationSchema={schema}
        onSubmit={ (values, { validate }) => {
            alert(JSON.stringify(values, null, 2));
        }}
        initialValues={{}}
>
   {({
      handleSubmit,
      handleChange,
      handleBlur,
      values,
      touched,
      isValid,
      errors,
     }) => (
         <Form onSubmit={handleSubmit}> 
             ...
             {/* EXAMPLE */}
             <Form.Control type="date"
                           name="expirationDate"
                           value={values.expirationDate}
                           onChange={handleChange}
                           onBlur={handleBlur}
                           isInvalid={touched.expirationDate && errors.expirationDate}    
             </Form.Control>
         </Form>

...
// Yup Schema used for form validation
const schema = yup.object().shape({
    expirationDate: yup.date().required('Expiration Date is required'),
    frequencyDays: yup.number().required('Frequency is required'),
    interval: yup.string().required('Frequency interval is required'),
    ...           

{
警报（JSON.stringify（值，null，2））；
}}
initialValues={{}
>
{({
手推，
handleChange，
车把，
价值观
感动的，
是有效的，
错误，
}) => (
...
{/*示例*/}
我认为你是对的，因为你有检查一个字段是否被
触摸
，验证后错误不会呈现。我认为一个解决方法是在调用onSubmit处理程序后，通过编程将所有字段的状态设置为
触摸=true

form.settouch（{…form.touch，[field.name]：true}）；

这里没有一个代码沙盒，而是类似这样的东西

<Formik enableReinitialize 
        validationSchema={schema}
        onSubmit={ (values, { validate }) => {
            // Set the form fields to touched programmatically
            form.setTouched({...form.touched,[field.name]: true });

            alert(JSON.stringify(values, null, 2));
        }}
        initialValues={{}}
>
   {({
      handleSubmit,
      handleChange,
      handleBlur,
      values,
      touched,
      isValid,
      errors,
     }) => (
         <Form onSubmit={handleSubmit}> 
             ...
             {/* EXAMPLE */}
             <Form.Control type="date"
                           name="expirationDate"
                           value={values.expirationDate}
                           onChange={handleChange}
                           onBlur={handleBlur}
                           isInvalid={touched.expirationDate && errors.expirationDate}    
             </Form.Control>
         </Form>

{
//将表单字段设置为以编程方式接触
setTouched（{…form.toucted，[field.name]：true}）；
警报（JSON.stringify（值，null，2））；
}}
initialValues={{}
>
{({
手推，
handleChange，
车把，
价值观
感动的，
是有效的，
错误，
}) => (
...
{/*示例*/}