The ranges parameter doesn't seem to update after the first render. For example, here I have an option to select the range in the past 5 minutes, however this range is stuck on between 5 minutes before page load and the load time, instead of current time, despite now=new Date(); Please advise on how to update ranges.
class TimeContainer extends Component {
render() {
let startTime = moment(new Date(this.props.startTime));
let endTime = moment(new Date(this.props.endTime));
let value = `${startTime.format("MM/DD/YYYY HH:mm")} - ${endTime.format(
"MM/DD/YYYY HH:mm"
)}`;
let now = new Date();
let ranges = {
"5 Minutes": [moment(now).subtract(5, "minutes"), moment(now)],
};
let local = {
format: "MM-DD-YYYY HH:mm",
sundayFirst: false,
};
return (
<div>
<DateTimeRangeContainer
ranges={ranges}
start={startTime}
end={endTime}
local={local}
maxDate={moment(now)}
applyCallback={this.props.applyCallback}
pastSearchFriendly={true}
>
<Form.Control
id={this.props.id}
type="text"
label="Text"
readOnly
placeholder="Date Time Picker"
value={value"}
/>
</DateTimeRangeContainer>
</div>
);
}
}
The ranges parameter doesn't seem to update after the first render. For example, here I have an option to select the range in the past 5 minutes, however this range is stuck on between 5 minutes before page load and the load time, instead of current time, despite now=new Date(); Please advise on how to update ranges.