From a7da435079da6ab8bf8028d0870847375871f9a5 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Thu, 14 Apr 2022 16:16:52 +0800
Subject: [PATCH] fix: datepicker panels change, close #5488

---
 components/vc-picker/hooks/useRangeViewDates.ts | 14 +++++---------
 1 file changed, 5 insertions(+), 9 deletions(-)

diff --git a/components/vc-picker/hooks/useRangeViewDates.ts b/components/vc-picker/hooks/useRangeViewDates.ts
index f73ba09f1..a8cdea118 100644
--- a/components/vc-picker/hooks/useRangeViewDates.ts
+++ b/components/vc-picker/hooks/useRangeViewDates.ts
@@ -3,7 +3,7 @@ import type { GenerateConfig } from '../generate';
 import { getValue, updateValues } from '../utils/miscUtil';
 import { getClosingViewDate, isSameYear, isSameMonth, isSameDecade } from '../utils/dateUtil';
 import type { Ref } from 'vue';
-import { watch, computed, ref } from 'vue';
+import { watchEffect, computed, ref } from 'vue';
 
 function getStartEndDistance<DateType>(
   startDate: DateType,
@@ -99,14 +99,10 @@ export default function useRangeViewDates<DateType>({
   const startViewDate = ref(null);
 
   const endViewDate = ref(null);
-  watch(
-    viewDates,
-    () => {
-      startViewDate.value = getViewDate(0);
-      endViewDate.value = getViewDate(1);
-    },
-    { immediate: true },
-  );
+  watchEffect(() => {
+    startViewDate.value = getViewDate(0);
+    endViewDate.value = getViewDate(1);
+  });
 
   function setViewDate(viewDate: DateType | null, index: 0 | 1) {
     if (viewDate) {