要解决Antd日历在状态更改时没有显示所选月份的问题,可以使用以下代码示例:
首先,确保你已经安装了Antd和Moment.js。
import React, { useState } from 'react';
import { Calendar } from 'antd';
import moment from 'moment';
const CalendarComponent = () => {
const [selectedMonth, setSelectedMonth] = useState(moment());
const handleMonthChange = (date) => {
setSelectedMonth(date);
};
return (
);
};
export default CalendarComponent;
import React from 'react';
import CalendarComponent from './CalendarComponent';
const App = () => {
return (
Antd日历示例
);
};
export default App;
通过上述代码,在CalendarComponent组件中,我们使用useState来定义一个名为selectedMonth的状态,它的初始值为moment(),表示当前的月份。然后,我们在handleMonthChange函数中更新selectedMonth的值,以便在日历中显示所选的月份。
在Calendar组件中,我们将selectedMonth作为value传递给Calendar组件,并在onChange事件中调用handleMonthChange函数来更新selectedMonth的值。
这样,当你在日历中选择不同的月份时,selectedMonth的状态将被更新,并显示所选的月份。