uView2.0的时间选择器bug

最新推荐文章于 2025-11-12 09:49:13 发布

原创最新推荐文章于 2025-11-12 09:49:13 发布 · 3.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#bug #javascript #vue.js

在uView2.0中遇到一个时间选择器u-datetime-picker的问题，当通过v-model绑定数据时，显示的不是用户友好的时间格式，而是时间戳。这给用户界面带来了困扰。

使用 u-datetime-picker 通过v-model 只会显示时间戳。

<u-form-item label="截至时间" prop="userInfo.sex" borderBottom @click="showTime = true" ref="item1" required>
				<u--input v-model="timeValue" disabled disabledColor="#ffffff" placeholder="请选择"
					border="none"></u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>

<u-datetime-picker :show="showTime" mode="datetime" @cancel="showTime = false" @confirm="confirmTime" :formatter="formatter"></u-datetime-picker>


confirmTime(val) {
				this.showTime = false;
				const timeFormat = uni.$u.timeFormat;	// uView自带的时间格式化
				let timeValue = timeFormat(val.value, 'yyyy-mm-dd hh:MM:ss');
				this.model1.userInfo.time = timeValue;
			},
			formatter(type, value) {
				if (type === 'year') {
					return `${value}年`;
				}
				if (type === 'month') {
					return `${value}月`;
				}
				if (type === 'day') {
					return `${value}日`;
				}
				if (type === 'hour') {
					return `${value}时`;
				}
				if (type === 'minute') {
					return `${value}分`;
				}
				return value;
			},