uni-app uni-datetime-picker 日期选择器 type="daterange" 时，在小程序中已选择时间区间，再次点击时，之前选择的时间区间仍为选中状态

在uni-app的uni-datetime-picker组件中，当type="daterange"时，如果在小程序端出现已选择的时间区间再次点击时仍保持选中状态，这通常是由于组件的内部状态未正确重置导致的。

你可以通过以下方式解决：

1. 使用 v-model 绑定值并手动清空
   在关闭日期选择器或重新打开时，将绑定的值重置为空数组 []，确保组件重新渲染时没有残留的选中状态。

   <template>
     <uni-datetime-picker
       type="daterange"
       v-model="dateRange"
       @close="handleClose"
     />
   </template>
   
   <script>
   export default {
     data() {
       return {
         dateRange: []
       };
     },
     methods: {
       handleClose() {
         // 关闭选择器时清空数据，确保下次打开时无选中状态
         this.dateRange = [];
       }
     }
   };
   </script>
   

2. 使用 key 强制重新渲染
   通过改变 key 值强制组件重新初始化，避免内部状态缓存。

   <template>
     <uni-datetime-picker
       :key="pickerKey"
       type="daterange"
       v-model="dateRange"
     />
   </template>
   
   <script>
   export default {
     data() {
       return {
         dateRange: [],
         pickerKey: 0
       };
     },
     methods: {
       resetPicker() {
         this.pickerKey += 1; // 改变key值，强制重新渲染组件
       }
     }
   };
   </script>
   

3. 检查组件版本
   确保使用的 uni-datetime-picker 为最新版本，旧版本可能存在状态管理问题。

4. 使用 ref 调用组件方法
   通过 ref 获取组件实例，调用内部的 clear 或 reset 方法（如果组件支持）。

   <template>
     <uni-datetime-picker
       ref="datePicker"
       type="daterange"
       v-model="dateRange"
     />
   </template>
   
   <script>
   export default {
     methods: {
       resetPicker() {
         this.$refs.datePicker.clear(); // 尝试调用清空方法
       }
     }
   };
   </script>