Преглед изворни кода

报表数值条件首次点击清除无效问题解决

zhuth пре 6 година
родитељ
комит
a90b04e2b0
1 измењених фајлова са 25 додато и 4 уклоњено
  1. 25 4
      src/components/dashboardDesigner/mobileFilterList.jsx

+ 25 - 4
src/components/dashboardDesigner/mobileFilterList.jsx

@@ -97,9 +97,14 @@ class MobileFilterList extends React.Component {
                             defaultValue={value1}
                             type="digit"
                             clear
+                            onChange={() => {
+                                window.clearTimeout(this[`filter-value-${index}-timeoutkey-1`]);
+                            }}
                             onBlur={(value) => {
                                 if(value !== value1) {
-                                    this.changeFilterValue(filter, value, 1)
+                                    this[`filter-value-${index}-timeoutkey-1`] = window.setTimeout(() => {
+                                        this.changeFilterValue(filter, value, 1)
+                                    }, 100);
                                 }
                             }}
                         />
@@ -108,9 +113,14 @@ class MobileFilterList extends React.Component {
                             defaultValue={value2}
                             type="digit"
                             clear
+                            onChange={() => {
+                                window.clearTimeout(this[`filter-value-${index}-timeoutkey-2`]);
+                            }}
                             onBlur={(value) => {
-                                if(value !== value2) {
-                                    this.changeFilterValue(filter, value, 2)
+                                if(value !== value1) {
+                                    this[`filter-value-${index}-timeoutkey-2`] = window.setTimeout(() => {
+                                        this.changeFilterValue(filter, value, 2)
+                                    }, 100);
                                 }
                             }}
                         />
@@ -121,9 +131,20 @@ class MobileFilterList extends React.Component {
                             defaultValue={value1}
                             type="digit"
                             clear
+                            onChange={() => {
+                                window.clearTimeout(this[`filter-value-${index}-timeoutkey`]);
+                            }}
                             onBlur={(value) => {
+                                /**
+                                 * 因为点击清除按钮会先触发onBlur再触发onChange,如果onBlur直接调用changeFilterValue
+                                 * 改变条件实际值会由于组件key值更新而重绘,后续清除动作被取消,
+                                 * 值通过defaultValue显示为清除之前的值,导致从编辑状态点击清除无效的BUG,
+                                 * 所以这里用了延时将点击清除的onBlur动作单独处理
+                                 */
                                 if(value !== value1) {
-                                    this.changeFilterValue(filter, value, 1)
+                                    this[`filter-value-${index}-timeoutkey`] = window.setTimeout(() => {
+                                        this.changeFilterValue(filter, value, 1)
+                                    }, 100);
                                 }
                             }}
                         />