Skip to content

嵌入式日历无法禁止垂直滚动 #111

@837682042-hue

Description

@837682042-hue

tdesign-uniapp 版本

0.57

重现链接

No response

重现步骤

  1. 创建一个页面,嵌入 t-calendar 组件
  2. 设置 :use-popup="false" 使其为嵌入式显示
  3. 设置 switch-mode="none" 禁用手势切换
  4. 在移动端上下滑动日历区域
  5. 观察页面整体跟随滚动
  • 日历内部的 scroll-view 会触发垂直滚动
  • 导致整个页面跟随滚动
  • CSS 样式 overflow: hiddentouch-action: pan-x 无法完全阻止
<style scoped> /* 尝试禁止滚动,但不生效 */ .calendar-wrapper { overflow: hidden; touch-action: pan-x; } .attendance-calendar :deep(scroll-view) { overflow-y: hidden !important; touch-action: pan-x !important; overscroll-behavior: none !important; } </style>

期望结果

No response

实际结果

当使用 t-calendar 组件的嵌入模式(:use-popup="false")时,组件内部的 scroll-view 元素会触发垂直滚动,导致页面整体跟随滚动。即使通过 CSS 设置 overflow: hiddentouch-action: pan-x 也无法完全禁止。

框架版本

No response

浏览器版本

No response

系统版本

No response

Node版本

No response

补充说明

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions