ant-design / ant-design-mobile

Essential UI blocks for building mobile web apps.
https://mobile.ant.design
MIT License
11.5k stars 2.37k forks source link

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

Open cheng-xiaofeng opened 8 months ago

cheng-xiaofeng commented 8 months ago

Version of antd-mobile

5.33.0

What is this feature about?

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

zombieJ commented 8 months ago

给个 codesandbox 看看?

cheng-xiaofeng commented 8 months ago

给个 codesandbox 看看? image

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

zombieJ commented 8 months ago

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

Yueyanc commented 8 months ago

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

hanwenbo commented 7 months ago

@zombieJ 是的这里确实是个bug

liqiuqiui commented 7 months ago

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

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

angleneo commented 5 months ago

这个bug还没有修复吗

bravepg commented 5 months ago

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

angleneo commented 5 months ago

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

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: @.***>

liqiuqiui commented 5 months ago

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

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

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

Yueyanc commented 5 months ago

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

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

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

6521

lisatisfy commented 2 months ago

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

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

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

6521

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

zk2611 commented 1 month ago

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

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

luopeihai commented 2 weeks ago

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

 // 控制日期选择
   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]);