如何让我的占位符显示在日期选择器输入上？

Question

我的表单中有一个 react-datepicker 组件，我正在尝试放置一个显示 "please select a date" 的占位符，但日期选择器仅显示 date.I 进行了研究，有些人说占位符显示仅当 selected={...} 为 false 但我不知道如何使我的 selected={} 默认为 false 并在切换时显示。

我尝试使用 react-datepicker 的代码，它是 placeholderText="" 但我无法实现它

这是我的状态；

bookTime: {
          data: new Date(),
          name: "bookTime",
          category: "text",
          everFocused: false,
          isValid: true,         
          extra : {
            label:"Randevu Tarihi*",
            help: "Geçersiz Alan!"
          }
       },

这是我的日期选择器组件；

<DatePicker className="turkish"
                  locale={tr}
                  placeholderText="Please select a date"
                  onChange={this.handleChangeDatePicker}
                  onChangeRaw={this.handleDateChangeRaw}
                  selected={bookTime.data }

                  showTimeSelect
                  minTime={setHours(setMinutes(new Date(), 0), 7)}
                  maxTime={setHours(setMinutes(new Date(), 0), 22)}
                  minDate={subDays(new Date(), 0)}

                  timeFormat="HH:mm"
                  timeIntervals={60}
                  dateFormat="HH:mm,d MMMM yyyy"
                  timeCaption="Saat"

                />

Answer 1

您似乎在初始化时将当前日期设置为 bookTime.date。所以选择的值一开始就不会为空。

尝试在初始化时将 bookTime.date 值设置为 false。无论何时选择新日期，它 (this.handleChangeDatePicker) 都应该更新日期。

Answer 2

placeholderText={'Please select a date'}

有效！

如何让我的占位符显示在日期选择器输入上？

How can i make my placeholder show on datepicker input?

datepicker

placeholder

reactjs