在 flowbite-react Datepicker 组件中获取选定值 - 道具更改事件不起作用

Question

我在从 Datepicker

 库的 

flowbite-react 组件获取所选值时遇到问题。与 NextJS 一起使用。
该组件显示良好。
我尝试了以下代码，但选择日期时没有返回任何内容：

import { Datepicker } from "flowbite-react";

export default function ExampleComp(){
 return (
   <Datepicker
       onChange={(e) => console.log(e)} // not working
       onSelect={(e) => console.log(e)} // not working
       onInput={(e) => console.log(e)} // not working
       onSelectedDateChanged={(e) => console.log(e)} // Error: Does not exist on type 'IntrinsicAttributes & DatepickerProps'
      />
  )
}

官方文档页面中没有任何具体用例，但在

storybook

中有道具

onSelectedDateChanged

。我正在使用它，但是

Error: Does not exist on type 'IntrinsicAttributes & DatepickerProps

请帮忙。

版本

• “流咬”：“^1.8.1”，
• “flowbite-react”：“^0.6.0”，
• “tailwindcss”：“3.3.3”，
• “下一个”：“19.4.13”

Answer 1

onSelectedDateChanged 为我工作，将函数传递给此道具，并获取所需的输出，将其与像这样的钩子反应一起使用

<Controller name="date"
            control={control}
            rules={{ required: 'Date is required' }}
            render=
            {({ field }) => (
             <Datepicker
              value={field.value}
              onSelectedDateChanged={(date) => field.onChange(date)}
              dateFormat="yyyy-MM-dd"
              className="border rounded px-4 py-2 w-full" />
            )}
          /> 

对于常规使用，您可以使用 useState，并使用它更新日期。

  const handleDatePickerChange = (date) => {
    setSelectedDate(date);
    console.log(date);
  };

<Datepicker name="selectedDate" value={selectedDate}
            onSelectedDateChanged={handleDatePickerChange} /> 

Answer 2

有点晚了，但也许你会需要它。

const handleDateChange = (date: Date) => {
   console.log(date.toISOString().split("T")[0]);
};

<Datepicker id="date" onSelectedDateChanged={handleDateChange}/>
            

应该可以。