ant-design / ant-design/pro-components

🧐[问题]页面上有个倒计时定时器,打开表格form表单dateRange日期区间选择器

Open
#9,312 1 comment 0 reactions 0 assignees View on GitHub
⭕️ bug
Dominant language
TypeScript
Stars
4.8k
Forks
1.4k
Avg merge
10h 44m
Merged PRs (30d)
3

Description

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

### 🧐 问题描述

页面上有个倒计时定时器,打开表格form表单dateRange日期区间选择器,默认了30天的日期,点击下拉框打开之后不能切换月份,每秒都会切换回当前默认的月份,手动选择一次之后才可已正常选择

### 💻 示例代码
{
title: '开播日期',
dataIndex: 'liveStartDate',
align: 'center',
valueType: 'dateRange',
sorter: true, // 启用排序
search: {
transform: (value) => {
return {
liveStartDate: value[0],
liveEndDate: value[1],
};
},
},
render: (value, record) => {
return


{record.liveStartDate}
({getWeek(record.liveStartDate)})

}
},

useEffect(() => {
formRef.current.setFieldsValue({
liveStartDate: [dayjs().format(dateFormat), dayjs().add(30, 'day').format(dateFormat)],
})
ststusRef.current = '';
getTime();
getList();
return () => {
if (timerRef.current) {
clearInterval(timerRef.current);
}
};
}, []);
const getList = async (queryParams?: queryParams) => {
if (queryParams?.isRefresh) {
actionRef?.current?.reload();
} else {
actionRef.current?.reloadAndRest();
}
setSecond(60);
setTimeout(() => {
startTimer();
}, 50);
}

### 🚑 其他信息

Image

Contributor guide

Open the contributing guide

Research direction

Reproduce the issue using the shown dateRange form configuration and the useEffect timer setup, then inspect the ProComponents dateRange field and its surrounding form behavior. Confirm whether the countdown causes the picker to reset months, and consider the issue done when month navigation remains stable without requiring a manual selection.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.