uniapp uni-datetime-picker 弹窗弹出时 点击时间不需要把键盘点出来
时间: 2024-09-29 19:01:56 浏览: 46
UniApp 的 `uni-datetime-picker` 组件在弹出日期和时间选择器时,如果你想隐藏键盘,可以设置组件的 `show-time-input` 属性默认为 `false` 或者动态控制它。当用户需要输入时间时,可以监听 picker 的事件,如点击按钮或确定操作,然后手动触发时间输入面板的显示。
例如,在 Vue 模板中,你可以这样做:
```html
<template>
<view>
<uni-datetime-picker v-model="datetime" :show-time-input="isShowTimeInput" @confirm="onConfirm"></uni-datetime-picker>
</view>
</template>
<script>
export default {
data() {
return {
datetime: '',
isShowTimeInput: false,
};
},
methods: {
onConfirm() {
this.isShowTimeInput = true; // 当需要输入时间时打开
setTimeout(() => {
this.$refs.datetime.timeInput.focus(); // 调整焦点显示键盘
}, 0);
},
},
};
</script>
```
这样,只有在用户确认需要输入时间时,键盘才会显示。记得在选择完毕后关闭 `isShowTimeInput` 以恢复默认行为。
阅读全文