opti: datetime-picker demo

Author: Fasttian

pages/nvue/datetime-picker/datetime-picker.nvue

@@ -3,7 +3,7 @@
 		<text class="example-info">可以同时选择日期和时间的选择器</text>
 		<uni-section :title="'日期用法：' + single" type="line"></uni-section>
 		<view class="example-body">
-			<uni-datetime-picker v-model="single" start="2021-3-20" end="2021-5-20" />
+			<uni-datetime-picker type="date" start="2021-3-20" end="2021-5-20" @change="change" />
 		</view>
 		<uni-section :title="'时间戳用法：' + single" type="line"></uni-section>
 		<view class="example-body">
@@ -46,14 +46,11 @@
 				single: '2021-04-3',
 				'datetimesingle': '',
 				range: ['2021-03-8', '2021-4-20'],
-				datetimerange: ['2021-03-20 20:10:10', '2021-05-10 10:10:10']
+				datetimerange: ['2021-03-20 20:10:10', '2021-05-10 10:10:10'],
 			}
 		},
 
 		watch: {
-			single(newval) {
-				console.log('单选:', this.single);
-			},
 			datetimesingle(newval) {
 				console.log('单选:', this.datetimesingle);
 			},
@@ -63,6 +60,13 @@
 			datetimerange(newval) {
 				console.log('范围选:', this.datetimerange);
 			}
+		},
+
+		methods:{
+			change(e) {
+				this.single = e
+				console.log('----change事件:', this.single = e);
+			}
 		}
 	}
 </script>

pages/vue/datetime-picker/datetime-picker.vue

@@ -3,7 +3,7 @@
 		<text class="example-info">可以同时选择日期和时间的选择器</text>
 		<uni-section :title="'日期用法：' + single" type="line"></uni-section>
 		<view class="example-body">
-			<uni-datetime-picker v-model="single" start="2021-3-20" end="2021-5-20" />
+			<uni-datetime-picker type="date" start="2021-3-20" end="2021-5-20" @change="change" />
 		</view>
 		<uni-section :title="'时间戳用法：' + single" type="line"></uni-section>
 		<view class="example-body">
@@ -46,14 +46,11 @@
 				single: '2021-04-3',
 				'datetimesingle': '',
 				range: ['2021-03-8', '2021-4-20'],
-				datetimerange: ['2021-03-20 20:10:10', '2021-05-10 10:10:10']
+				datetimerange: ['2021-03-20 20:10:10', '2021-05-10 10:10:10'],
 			}
 		},
 
 		watch: {
-			single(newval) {
-				console.log('单选:', this.single);
-			},
 			datetimesingle(newval) {
 				console.log('单选:', this.datetimesingle);
 			},
@@ -63,6 +60,13 @@
 			datetimerange(newval) {
 				console.log('范围选:', this.datetimerange);
 			}
+		},
+
+		methods:{
+			change(e) {
+				this.single = e
+				console.log('----change事件:', this.single = e);
+			}
 		}
 	}
 </script>