feat(RangePicker): adaptive to Picker

ant-design · Jul 26, 2022 · 02d05b8 · 02d05b8
2 parents c9bb18e + cc1e95d
commit 02d05b8
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 24 deletions.
diff --git a/src/DatePicker/index.ts b/src/DatePicker/index.ts
@@ -117,8 +117,7 @@ Component({
       const min = this.getMin();
       const max = this.getMax();
       if (max < min) {
-        this.setData({ columns: [] });
-        return;
+        return [];
       }
       let currentPickerDay = dayjs();
       if (currentValue.length > 0) {
@@ -146,10 +145,10 @@ Component({
         date = max.toDate();
         selectedIndex = getValueByDate(date, precision);
       }
-      const newClolumns = this.generateData(selectedIndex);
-      if (!equal(newClolumns, this.data.columns)) {
+      const newColumns = this.generateData(selectedIndex);
+      if (!equal(newColumns, this.data.columns)) {
         this.setData({
-          columns: newClolumns
+          columns: newColumns
         }, () => {
           this.setData({ currentValue: selectedIndex });
           if (onPickerChange) {

diff --git a/src/RangePicker/index.ts b/src/RangePicker/index.ts
@@ -137,7 +137,7 @@ Component({
     setCurrentValue() {
       const { _visible } = this; // 隐藏状态下从CValue触发，展开状态使用当前数据
       const { precision } = this.props;
-      const { cValue, pickerType } = this.data;
+      const { cValue, pickerType, columns } = this.data;
       let { currentStartDate, currentEndDate } = this.data;
       const currentStartDateByCValue = cValue?.[0] || null;
       const currentEndDateByCValue = cValue?.[1] || null;
@@ -176,20 +176,24 @@ Component({
         pickerType === 'start' ? currentStartDate : currentEndDate,
         precision
       );
-      this.setData({ currentStartDate, currentEndDate, currentValue });
-      this.generateData();
+      const newColumns = this.generateData(currentValue);
+      if (!equal(newColumns, columns)) {
+        this.setData({ columns: newColumns }, () => {
+          this.setData({ currentStartDate, currentEndDate, currentValue });
+        });
+      } else {
+        this.setData({ currentStartDate, currentEndDate, currentValue });
+      }
     },
     /**
      * 生成选项数据，didmound、picker change、打开弹窗、切换picker type触发
      */
-    generateData() {
+    generateData(currentValue) {
       const { precision } = this.props;
-      const { columns, currentValue } = this.data;
       const min = this.getMin();
       const max = this.getMax();
       if (max < min) {
-        this.setData({ columns: [] });
-        return;
+        return [];
       }
       let currentPickerDay = dayjs();
       if (currentValue.length > 0) {
@@ -200,9 +204,7 @@ Component({
       }
 
       const newColumns = getRangeData(precision, min, max, currentPickerDay);
-      if (!equal(columns, newColumns)) {
-        this.setData({ columns: newColumns });
-      }
+      return newColumns;
     },
 
     onChange(selectedIndex) {
@@ -219,7 +221,7 @@ Component({
         date = max.toDate();
         selectedIndex = getValueByDate(date, precision);
       }
-      const { pickerType } = this.data;
+      const { pickerType, columns } = this.data;
       const newData: any = {
         currentValue: selectedIndex,
       };
@@ -228,15 +230,34 @@ Component({
       } else {
         newData.currentEndDate = date;
       }
-      this.setData(newData);
-      this.generateData();
-      if (onPickerChange) {
-        onPickerChange(
-          pickerType,
-          date,
-          dayjs(date).format(format),
-          selectedIndex
+      const newColumns = this.generateData(selectedIndex);
+      if (!equal(newColumns, columns)) {
+        this.setData(
+          {
+            columns: newColumns,
+          },
+          () => {
+            this.setData(newData);
+            if (onPickerChange) {
+              onPickerChange(
+                pickerType,
+                date,
+                dayjs(date).format(format),
+                selectedIndex
+              );
+            }
+          }
         );
+      } else {
+        this.setData(newData);
+        if (onPickerChange) {
+          onPickerChange(
+            pickerType,
+            date,
+            dayjs(date).format(format),
+            selectedIndex
+          );
+        }
       }
     },