2

ユーザーが必要な情報を送信できるフォームがあります

フィールドの 1 つは生年月日です

その特定のフィールドにreact-datepickerパッケージを使用しています

コードの一部は次のようになります。

        <label>
          <DatePicker
            autoComplete='off'
            dateFormatCalendar="MMMM"
            showYearDropdown
            scrollableYearDropdown
            onChange={this.handleChange}
            selected={this.state.formData.dob}
            maxDate={moment().subtract(6570, "days")}
            minDate={moment()}
            placeholderText="Date of birth"
            name="dob"
            customInput={
              <Input type='text' onKeyPress={e => e.preventDefault()} validations={[required]} value={this.state.formData.dob} />
            }
          />
        </label>

6570 = 18*365 は 18 年から変換された日です。364 日もあるから、これはしっかりしたものではないことはわかっています。

これは、datepicker が日付を選択できない場合のスクリーンショットです。

https://gyazo.com/4d66a8e59dbca5e79c3af7d6de139d21

ユーザーがフォームを送信するために少なくとも18歳になる方法をどのように達成できるかについての考えや推奨事項はありますか?

ありがとうございました！

4

5 に答える 5

1

上記の解決策は私にとってはうまくいきませんでした._dをmoment().subtract(18, "years")の後に追加して、日付のみをトリミングしました。

私の最終的なコード:

 <DatePicker
        selected={ selectedDate }
        onChange={ date => setSelectedDate(date) }
        dateFormat='dd/MM/yyyy'
        maxDate={moment().subtract(18, 'years')._d}
        showYearDropdown
        scrollableYearDropdown
      />
于 2020-12-12T00:37:49.617 に答える
0

私はこのスレッドに少し遅れていることを知っています>しかし、最近、日付ピッカーの範囲を設定したい場合、この問題にも行き詰まりました。この解決策を思いつきました

            <DatePicker
              showYearDropdown
              dateFormatCalendar="MMMM"
              yearDropdownItemNumber={150}
              minDate={moment().subtract(150, "years")._d}
              maxDate={moment().subtract(18, "years")._d}
              scrollableYearDropdown
            />

rangeLocked 応答を取得するには、Min/Max および yearDropdownItemNumber オプションを追加する必要があります

rangeLockを探している人の助けになることを願っています

于 2021-06-20T17:16:03.560 に答える