У меня есть средство выбора даты, которое отображается условно в зависимости от типа изменений, которые хочет сделать пользователь, будь то «будущий» или «постоянный»:

В первый раз, когда отображается средство выбора даты, я вижу это предупреждение:

backend.js: 6 Предупреждение: невозможно обновить во время существующего перехода состояния (например, при render ). Методы рендеринга должны быть чистой функцией реквизита и состояния. в анонимном (создан DatePicker)

 I'm not sure why this is happening but I tried to change the logic to the following but that has not worked either: 
  const [startDate, setStartDate] = useState(props.input.value); const ref = React.createRef(); const onChange = useCallback(date ={amp}gt; setStartDate(date), []); return ( {amp}lt;DatePicker selected={startDate} onChange={() ={amp}gt; onChange} 

и это мой DatePicker:

 const ButtonImage = ({onClick}) ={amp}gt; ( {amp}lt;div onClick={onClick} className="button-container"{amp}gt; {amp}lt;img src="https://mcontent/static_assets/Media/icon-calendar.svg" /{amp}gt; {amp}lt;/div{amp}gt; ); ButtonImage.propTypes = { onClick: PropTypes.func }; const CustomInput = React.forwardRef((props, refs) ={amp}gt; { const inputProps = props.inputProps; inputProps.input.onChange(props.value); return ( {amp}lt;div className="input-button"{amp}gt; {amp}lt;FormattedTextInput {...inputProps} ref={refs} onFocus={props.onFocus} onChange={props.onChange} helpText={{amp}lt;span aria-hidden="true"{amp}gt;YYYY-MM-DD | HH:MM{amp}lt;/span{amp}gt;} /{amp}gt; {amp}lt;/div{amp}gt; ); }); CustomInput.propTypes = { inputProps: PropTypes.object, onChange: PropTypes.func, onFocus: PropTypes.func, value: PropTypes.string }; const DateTimePicker = props ={amp}gt; { const [startDate, setStartDate] = useState(null); const ref = React.createRef(); useEffect(() ={amp}gt; { if (props.input.value === '') { setStartDate(null); } }, [props.input.value]); return ( {amp}lt;DatePicker selected={startDate} onChange={date ={amp}gt; setStartDate(date)} minDate={moment()} customInput={{amp}lt;CustomInput inputProps={props} ref={ref} /{amp}gt;} showTimeSelect disabledKeyboardNavigation timeFormat="HH:mm" timeIntervals={15} timeCaption="time" dateFormat="YYYY-MM-DD HH:mm" /{amp}gt; ); }; DateTimePicker.propTypes = { input: PropTypes.object }; 

Вот как я называю DatePicker:

 {this.props.searchPageFormData {amp}amp;{amp}amp; this.props.searchPageFormData.type === 'F' {amp}amp;{amp}amp; ( {amp}lt;FormSection className="page-subheader" label="Date"{amp}gt; {amp}lt;FormGroup{amp}gt; {amp}lt;Field className="input" component={DateTimePicker} label="Future Date" name="futureDate" validate={[required, validDateTimeFormat]} formatting="9999-99-99 99:99" /{amp}gt; {amp}lt;/FormGroup{amp}gt; {amp}lt;/FormSection{amp}gt; )}