Коробка выбора Formik не выбирается

Question

У меня есть работающий компонент React с Formik с initialValues, и все остальное работает отлично, кроме радиокнопки ниже.

Радиоконтроллер не выбирается, в чем может быть ошибка?

<Field
                            name="accountPurpose"
                            render={({ field }) => (
                              <>
                                <div className="radio-item">
                                  <input
                                    {...field}
                                    id="all"
                                    value="all"
                                    checked={field.value === "all"}
                                    name="type"
                                    type="radio"
                                  />
                                  <label htmlFor="all"> All</label>
                                </div>

                                <div className="radio-item">
                                  <input
                                    {...field}
                                    id="distribution"
                                    value="distribution"
                                    name="type"
                                    checked={field.value === "distribution"}
                                    type="radio"
                                  />
                                  <label htmlFor="distribution">
                                    Distribution
                                  </label>
                                </div>
                                <div className="radio-item">
                                  <input
                                    {...field}
                                    id="redemption"
                                    value="redemption"
                                    name="type"
                                    checked={field.value === "redemption"}
                                    type="radio"
                                  />
                                  <label htmlFor="redemption">
                                    {" "}
                                    Redemption
                                  </label>
                                </div>
                              </>
                            )}
                          />

Answer 1

Удалите checked={field.value ===...} со всех входов и используйте defaultChecked только для одного.

, как показано ниже

        <input
          id="all"
          value="all"
          name="type"
          type="radio"
          defaultChecked
          {...field}
          />