uni-app picker时间选择器在HarmonyOS Next真机上选择时无法选定,滑动停止后自动跳回当天日期
uni-app picker时间选择器在HarmonyOS Next真机上选择时无法选定,滑动停止后自动跳回当天日期
操作步骤:
- 真机上,在选择的时候,不能选择,当我滑动停止的时候,都会跳到当天日期
预期结果:
- 真机上,在选择的时候,当我滑动停止的时候,应该是我滑动到的当前日期选项,而不是跳到当天的日期选项
实际结果:
- 真机上,在选择的时候,不能选择,当我滑动停止的时候,都跳到当天日期
bug描述:
- 官方文档说是能兼容,但是在真机上,在选择的时候,不能选择,当我滑动停止的时候,都跳到当天日期
附件
信息项 | 内容 |
---|---|
产品分类 | uniapp/App |
PC开发环境 | Windows |
PC开发环境版本 | windows10 专业版 |
HBuilderX类型 | 正式 |
HBuilderX版本 | 4.24 |
手机系统 | 全部 |
手机机型 | HUEWEI Mate 60 pro |
页面类型 | vue |
vue版本 | vue2 |
打包方式 | 离线 |
项目创建方式 | HBuilderX |
更多关于uni-app picker时间选择器在HarmonyOS Next真机上选择时无法选定,滑动停止后自动跳回当天日期的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
1 回复
更多关于uni-app picker时间选择器在HarmonyOS Next真机上选择时无法选定,滑动停止后自动跳回当天日期的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
针对您提到的uni-app中picker时间选择器在HarmonyOS Next真机上选择时无法选定,滑动停止后自动跳回当天日期的问题,这通常与picker组件的事件处理或系统兼容性有关。以下是一个示例代码,展示了如何使用uni-app的picker组件,并包含一些可能的解决方法来处理此类问题。请注意,由于我无法直接测试HarmonyOS环境,这些代码主要是基于常见的picker使用方式和可能的修复策略。
示例代码
<template>
<view>
<button @click="showPicker">选择日期</button>
<view v-if="selectedDate">选定日期: {{ selectedDate }}</view>
</view>
</template>
<script>
export default {
data() {
return {
selectedDate: '',
pickerOptions: {
type: 'date',
start: '2020-01-01',
end: '2030-12-31'
}
};
},
methods: {
showPicker() {
uni.showActionSheet({
itemList: ['选择日期'],
success: (res) => {
if (res.tapIndex === 0) {
uni.picker({
mode: 'date',
range: this.getDateRange(),
value: this.formatDate(new Date()),
success: (result) => {
this.selectedDate = this.formatDate(new Date(result.value));
// 尝试手动触发setData更新视图,防止自动回跳
this.$forceUpdate();
},
fail: (err) => {
console.error('picker失败:', err);
}
});
}
}
});
},
getDateRange() {
const start = new Date(this.pickerOptions.start).getTime();
const end = new Date(this.pickerOptions.end).getTime();
const currentDate = new Date().getTime();
const range = [];
let time = start;
while (time <= end) {
range.push(this.formatDate(new Date(time)));
time = time + 24 * 60 * 60 * 1000;
}
return range;
},
formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
}
}
};
</script>
说明
- picker配置:设置了
type
为date
,并指定了开始和结束日期。 - 日期范围生成:
getDateRange
方法生成一个日期数组,用于picker的range
属性。 - 日期格式化:
formatDate
方法用于格式化日期字符串。 - 强制更新视图:在picker成功回调中,尝试使用
this.$forceUpdate()
强制Vue组件重新渲染,以防系统级的bug导致视图未正确更新。
由于问题可能与HarmonyOS系统的特定行为有关,如果上述方法无效,建议检查uni-app和HarmonyOS的兼容性文档或寻求官方支持。