-
Notifications
You must be signed in to change notification settings - Fork 1.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
优化 日期选择 daterange 类型在移动端的表现 #5116
Labels
untriaged
need to sort
Comments
同求,这个组件当使用时间选择器(不是日期是时间)且使用小屏设备时这个菜单会溢出屏幕,由于不好写复现一直没提issue |
This issue does not have any recent activity. If you are still experiencing similar problems, open a new error, including a minimal copy of the problem |
其实 在这里支持一下单面板展示就行了, export default defineComponent({
name: 'DateRangePanel',
props: useDualCalendarProps,
setup(props) {
if (__DEV__) {
watchEffect(() => {
if (props.actions?.includes('now')) {
warnOnce(
'date-picker',
'The `now` action is not supported for n-date-picker of `daterange` type'
)
}
})
}
return useDualCalendar(props, 'daterange')
},
render() {
const { mergedClsPrefix, mergedTheme, shortcuts, onRender, $slots } = this
onRender?.()
return (
<div
ref="selfRef"
tabindex={0}
class={[
`${mergedClsPrefix}-date-panel`,
`${mergedClsPrefix}-date-panel--daterange`,
!this.panel && `${mergedClsPrefix}-date-panel--shadow`,
this.themeClass
]}
onKeydown={this.handlePanelKeyDown}
onFocus={this.handlePanelFocus}
>
<div
ref="startDatesElRef"
class={`${mergedClsPrefix}-date-panel-calendar ${mergedClsPrefix}-date-panel-calendar--start`} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
TuSimple/naive-ui version (版本)
2.34.4
Vue version (Vue 版本)
3.3.4
Browser and its version (浏览器及其版本)
chrome 113
System and its version (系统及其版本)
安卓11
Node version (Node 版本)
Reappearance link (重现链接)
https://www.naiveui.com/zh-CN/os-theme/components/date-picker#%E9%80%9A%E7%94%A8%E7%9A%84-Props
Reappearance steps (重现步骤)
官方案例上,日期选择器daterange类型移动端表现也不佳
Expected results (期望的结果)
daterange类型会由两个日期面板拼合成,在移动端只能完整看到一个日期面板,另一个只能看一部份。期望两个面板在移动端可以上下排列
Actual results (实际的结果)
移动端
Remarks (补充说明)
The text was updated successfully, but these errors were encountered: