ant-design-mobile icon indicating copy to clipboard operation
ant-design-mobile copied to clipboard

CalendarPicker为什么只能向后滚动, 不能向前滚动

Open cheng-xiaofeng opened this issue 1 year ago • 14 comments

Version of antd-mobile

5.33.0

What is this feature about?

比如现在是2023年10月, 我用ref?.current?.jumpTo({ year: 2023, month: 11 })跳到了11月份, 我想滚动到10月份, 但没法回到10月份

cheng-xiaofeng avatar Oct 26 '23 02:10 cheng-xiaofeng

给个 codesandbox 看看?

zombieJ avatar Oct 26 '23 02:10 zombieJ

给个 codesandbox 看看? image

https://mobile.ant.design/zh/components/calendar-picker/calendar-picker 这里,向上滚动就滚不动

cheng-xiaofeng avatar Oct 26 '23 02:10 cheng-xiaofeng

嗯,jumpTo 还隐含了设置起始时间的约定。这个的确不是很符合直觉。

zombieJ avatar Oct 26 '23 03:10 zombieJ

@zombieJ 还有就是抽屉出现时,默认在min处,而不是当前选中项,如果我的min设置到一年前,我每次都需要手动去滚动

Yueyanc avatar Nov 03 '23 08:11 Yueyanc

@zombieJ 是的这里确实是个bug

hanwenbo avatar Nov 09 '23 09:11 hanwenbo

@zombieJ 还有就是抽屉出现时,默认在min处,而不是当前选中项,如果我的min设置到一年前,我每次都需要手动去滚动

+1,默认打开的时候没有滚动到当前选中的位置在使用上感觉挺不友好的

liqiuqiui avatar Nov 17 '23 07:11 liqiuqiui

这个bug还没有修复吗

angleneo avatar Jan 11 '24 03:01 angleneo

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

bravepg avatar Jan 15 '24 03:01 bravepg

至少可以增加个自定义的可选时间范围

ly @.***

 

------------------ 原始邮件 ------------------ 发件人: "ant-design/ant-design-mobile" @.>; 发送时间: 2024年1月15日(星期一) 中午11:18 @.>; @.@.>; 主题: Re: [ant-design/ant-design-mobile] CalendarPicker为什么只能向后滚动, 不能向前滚动 (Issue #6412)

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.Message ID: @.***>

angleneo avatar Jan 15 '24 05:01 angleneo

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

这是默认的min,max限制没啥问题,问题出在每次打开这个picker显示的是min所在的日期,而不是当前选中项所在的日期

liqiuqiui avatar Jan 16 '24 01:01 liqiuqiui

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

这是默认的min,max限制没啥问题,问题出在每次打开这个picker显示的是min所在的日期,而不是当前选中项所在的日期

#6521

Yueyanc avatar Jan 16 '24 01:01 Yueyanc

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

这是默认的min,max限制没啥问题,问题出在每次打开这个picker显示的是min所在的日期,而不是当前选中项所在的日期

#6521

同样的有这个困扰。如果设置了min,每次打开这个picker显示的是min所在的日期。

lisatisfy avatar Apr 18 '24 07:04 lisatisfy

@angleneo @cheng-xiaofeng @liqiuqiui 你们在使用的时候,会期望这个组件可以无限滚动么?现在其实是限制了 6 个月的选择。

期望默认无限滚动,可配制 min、max,而且期望首次打开的时候,如果没有传入 value、defaultValue,则默认展示当前月,而非展示 min 所在月 🙏🙏🙏

zk2611 avatar May 16 '24 12:05 zk2611

监听日期选择框,手动滚动到对应默认选中的日期未知

 // 控制日期选择
   const [visibleCalendarPicker, setVisibleCalendarPicker] = useState(false)

  useEffect(() => {
    if (visibleCalendarPicker) {
      const timeout = setTimeout(() => {
        const elementCalendar = document.querySelector<HTMLDivElement>('.adm-calendar-picker-view-body');
        const element = document.querySelector<HTMLDivElement>('.adm-calendar-picker-view-cell-selected-begin');
        if (elementCalendar && element) {
          elementCalendar.scrollTop = element.offsetTop - 200;
        }
      }, 100);
      return () => clearTimeout(timeout);
    }
  }, [visibleCalendarPicker]);

luopeihai avatar Jun 18 '24 09:06 luopeihai