反应数据报警器选择中如何显示时间范围
反应数据报警器选择中如何显示时间范围
提问于 2022-12-02 12:31:49
我想在我的反应-数据报警器中显示一个范围时间。我想选择一个范围(9:00-9:30)，而不是只选择9:00。
下面是我当前的数据采集时间选择：
以下是我想要得到的：
谢谢
回答 1
Stack Overflow用户
发布于 2022-12-02 14:44:05
若要在react datepicker组件中显示时间范围，可以使用showTimeSelect和timeFormat道具。下面是一个示例：
import React from 'react';
import DatePicker from 'react-datepicker';
import "react-datepicker/dist/react-datepicker.css";
function MyDatePicker() {
return (
<DatePicker
showTimeSelect
timeFormat="HH:mm"
timeIntervals={30}
dateFormat="MMMM d, yyyy h:mm aa"
timeCaption="Time"
/>
);
}在本例中，timeFormat支柱被设置为"HH:mm“以以小时和分钟为单位显示时间，而timeIntervals支柱设置为30以30分钟间隔显示时间选项。
您还可以使用选定的道具来设置默认的选定时间范围。例如，要将默认范围设置为9:00 - 9:30，可以执行以下操作：
import React from 'react';
import DatePicker from 'react-datepicker';
import "react-datepicker/dist/react-datepicker.css";
function MyDatePicker() {
return (
<DatePicker
selected={[new Date(2020, 1, 1, 9, 0), new Date(2020, 1, 1, 9, 30)]}
showTimeSelect
timeFormat="HH:mm"
timeIntervals={30}
dateFormat="MMMM d, yyyy h:mm aa"
timeCaption="Time"
/>
);
}我希望这能帮到你!如果你还有其他问题，请告诉我。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/74655830
复制相关文章
相似问题
腾讯云开发者
