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

Question

我的表单中有一个react-datepicker组件，我试图放置一个占位符，上面写着“请选择一个日期”，但日期选择器只显示日期。我做了研究，有些人说占位符仅在为selected={...} 假时才显示，但我不知道如何使我的selected={}默认为 false 并在切换时显示。

\n\n

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

\n\n

这就是我的状态；

\n\n

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

\n\n

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

\n\n

<DatePicker className="turkish"\n                  locale={tr}\n                  placeholderText="Please select a date"\n                  onChange={this.handleChangeDatePicker}\n                  onChangeRaw={this.handleDateChangeRaw}\n                  selected={bookTime.data }\n\n                  showTimeSelect\n                  minTime={setHours(setMinutes(new Date(), 0), 7)}\n                  maxTime={setHours(setMinutes(new Date(), 0), 22)}\n                  minDate={subDays(new Date(), 0)}\n\n                  timeFormat="HH:mm"\n                  timeIntervals={60}\n                  dateFormat="HH:mm,d MMMM yyyy"\n                  timeCaption="Saat"\n\n                />\n

\n

Answer 1

placeholderText={'Please select a date'} 

这行得通！

Answer 2

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

尝试在初始化时将 bookTime.date 值设置为false 。每当选择新日期时，它（this.handleChangeDatePicker）都应该更新日期。