反应日期的 SingleDatePicker 未关闭更改

SingleDatePicker by react-dates is not closing on change

嘿,我已经在我的应用程序上设置了反应日期功能,但是选择日期后并没有关闭日历。

我这里有例子https://codesandbox.io/s/magical-dubinsky-xuxkj?file=/src/App.js:0-681

import React, { useState } from "react";
import { SingleDatePicker } from "react-dates";
import "react-dates/initialize";
import "react-dates/lib/css/_datepicker.css";

const CreateGroupEvent = (props) => {
  const [dob, setDob] = useState(null);
  const [focused, setFocused] = useState(false);
  const setDate = (date) => {
    setDob(date);
    setFocused(false);
  };

  return (
    <>
      <SingleDatePicker
        date={dob}
        // {...input}
        onOutsideClick={true}
        numberOfMonths={1}
        onDateChange={setDate}
        focused={focused}
        onFocusChange={setFocused}
        id="dob"
      />
    </>
  );
};

export default CreateGroupEvent;

** 已编辑:Here 是我的示例代码沙箱。

试试这个怎么样?

根据其 documentonFocusChange 似乎应该将 { focused : boolean } 个对象作为参数。

const onFocusChange = ({ focused }) => {
  setFocused(focused);
};
<SingleDatePicker
    date={dob}
    onOutsideClick={true}
    numberOfMonths={1}
    onDateChange={setDate}
    focused={focused}
    onFocusChange={onFocusChange}
    id="dob"
  />