使用React DayPicker获取特定一周的日期数组



我希望能够在react DayPicker中单击特定的周数,并将该周中包含的所有日期的数组返回给我。

我正在使用此DayPicker程序包:https://react-day-picker.js.org/

我已经从react dayPicker复制了示例代码,允许我单击一个月中的特定一周:https://react-day-picker.js.org/basics/customization

import { useState } from 'react'
import { DayPicker } from 'react-day-picker'
export const WeekPicker = () => {
const [weekNumber, setWeekNumber] = useState()
const footer = weekNumber
? `You clicked the week n. ${weekNumber}.`
: 'Try clicking a week number.'

return (
<DayPicker
showWeekNumber
onWeekNumberClick={setWeekNumber}
footer={footer}
/>
)
}

我可以在EventHandlers.d.ts文件中看到一个WeekNumberClickEventHandler,其变量名为date,但我只能访问weekNumber变量

/**The event handler when the week number is clicked. */
export declare type WeekNumberClickEventHandler = (
/** The week number that has been clicked. */
weekNumber: number, 
/** The dates in the clicked week. */
dates: Date[], 
/** The mouse event that triggered this event. */
e: React.MouseEvent) => void;

如有任何帮助,我们将不胜感激。我用JS编码,但我意识到DayPicker包是用TS编写的。

dates是回调中的第二个参数

import { useState } from 'react'
import { DayPicker } from 'react-day-picker'
export const WeekPicker = () => {
const [weekNumber, setWeekNumber] = useState()
const footer = weekNumber
? `You clicked the week n. ${weekNumber}.`
: 'Try clicking a week number.'

return (
<DayPicker
showWeekNumber
onWeekNumberClick={(weekNumber, dates) => {
setWeekNumber(weekNumber);
console.log(dates)
}}
footer={footer}
/>
)
}

相关内容

  • 没有找到相关文章

最新更新