next.js 在flowbite-react Datepicker组件中获取选定值- Props更改事件不工作

ulmd4ohb 于 2023-10-18 发布在 React

关注(0)|答案(1)|浏览(112)

从flowbite-react库中获取Datepicker组件的选定值时遇到问题。使用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中有prop onSelectedDateChanged。我正在使用它，但Error: Does not exist on type 'IntrinsicAttributes & DatepickerProps
好心帮忙。
版本

“flowbite”：“^1.8.1”，
“flowbite-react”：“^0.6.0”，
“tailwindcss”：“3.3.3”，
“下一页”：“13.4.19”

next.js

来源：https://stackoverflow.com/questions/77146513/get-selected-value-in-flowbite-react-datepicker-component-props-change-event-n

1条答案

按热度按时间

hjqgdpho1#

onSelectedDateChanged对我来说很有用，它向这个props传递一个函数，并获得所需的输出，像这样从hook中使用它和react

<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} />

赞(0）回复(0）举报 2023-10-18

我来回答

next.js 在flowbite-react Datepicker组件中获取选定值- Props更改事件不工作

1条答案

相关问题

热门标签

最新问答