[英]How to set react-dates calendar always open?
I am using react-dates library , DateRangePicker and trying to show calendar when component is rendered.我正在使用react-dates library , DateRangePicker 并尝试在渲染组件时显示日历。
I thought there would be props supported by react-dates itself but after an hour of searching I could not find it.我认为 react-dates 本身会支持道具,但经过一个小时的搜索后我找不到它。
import React, { useState } from 'react';
import { DateRangePicker } from 'react-dates';
import 'react-dates/initialize';
import 'react-dates/lib/css/_datepicker.css';
function Datepicker() {
const [dateRange, setdateRange] = useState({
startDate: null,
endDate: null
});
const [focus, setFocus] = useState(null);
const { startDate, endDate } = dateRange;
const handleOnDateChange = (startDate, endDate) =>
setdateRange(startDate, endDate);
return (
<DateRangePicker
startDatePlaceholderText="Start"
startDate={startDate}
startDateId="startDate"
onDatesChange={handleOnDateChange}
endDatePlaceholderText="End"
endDate={endDate}
endDateId="endDate"
displayFormat="MMM D"
focusedInput={focus}
onFocusChange={focus => setFocus(focus)}
/>
);
}
export default Datepicker;
Is there a callback function that I can use as a leverage to keep opening the calendar?是否有回调 function 可以用作继续打开日历的杠杆?
or should I change default set of 'react-dates/lib/css/_datepicker.css'?还是应该更改默认的“react-dates/lib/css/_datepicker.css”集?
I reviewed the source code of react-dates and you need to add this to always show picker.我查看了 react-dates 的源代码,您需要添加它以始终显示选择器。
const [focus, setFocus] = useState('startDate');
Hope this should work.希望这应该有效。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.