TypeError：無法讀取未定義 React 的屬性“匹配”

Question

我有兩個來自。 在注冊表單match() function 有效，但在 createEvent 中無效。 我正在使用react-final-form來管理我的 forms。

登記：

const emailReg = value => (value.match(/^[a-z\d]+[\w\d.-]*@(?:[a-z\d]+[a-z\d-]+\.){1,5}[a-z]{2,6}$/) ? undefined : `Wrong e-mail format`);

...

<Field
            name="email"
            validate={composeValidators(required, emailReg)}
          >
            {({ input, meta }) => (
              <div className={styles.registerFormField}>
                <input
                  {...input}
                  type="email"
                  placeholder="E-mail"
                  className={styles.registerFormInput}
                />
                {meta.error && meta.touched && (
                  <span className={styles.registerError}>{meta.error}</span>
                )}
              </div>
            )}
          </Field>

創建事件：

const timeReg = value => (value.match(/^(20|21|22|23|[01]d|d)(([:][0-5]d){1,2})$/) ? undefined : `Wrong time format`);

...

  <Field
            name="timeStartEvent"
            validate={composeValidators(timeReg)}
          >
            {({ input, meta }) => (
              <div className={styles.createEventFormField}>
                <label className={styles.createEventFormLabel}>
                  <img
                    src={TimeIcon}
                    className={styles.createEventFormIcon}
                  />
                </label>
                <input
                  {...input}
                  type="text"
                  placeholder="Poczatek"
                  className={styles.createEventFormInput}
                  style={{
                    width: "40%",
                    marginRight: "0",
                    borderRight: "1px solid #ddd",
                    borderRadius: "15px 0 0 15px"
                  }}
                />
                <Field
                  name="timeEndEvent"
                  validate={composeValidators(timeReg)}
                >
                  {({ input, meta }) => (
                    <input
                      {...input}
                      type="text"
                      placeholder="Koniec"
                      className={styles.createEventFormInput}
                      style={{
                        width: "40%",
                        marginLeft: "0",
                        borderLeft: "none",
                        borderRadius: "0px 15px 15px 0px"
                      }}
                    />
                  )}
                </Field>
                {meta.error && meta.touched && (
                  <span className={styles.registerError}>{meta.error}</span>
                )}
              </div>
            )}
          </Field>

而且我不知道為什么在 createEvent match() function 中給我這個錯誤：

TypeError: Cannot read property 'match' of undefined

這是 CreateEvent 和 Register 的完整代碼

Answer 1

您沒有將值傳遞給timeReg ，請驗證該值

const timeReg = value =>
  // check if value exists
  value && value.match(/^(20|21|22|23|[01]d|d)(([:][0-5]d){1,2})$/)
    ? undefined
    : `Niewłaściwy format`;

或將值傳遞給timeReg

<Field
   name="timeStartEvent"
   validate={composeValidators(() => timeReg(value))}
 >