fix(Step): labelPlacement value change dbl times

alibaba-fusion · Mar 11, 2019 · 3c7ae73 · 3c7ae73
1 parent 0b93378
commit 3c7ae73
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 6 deletions.
diff --git a/src/step/view/step-item.jsx b/src/step/view/step-item.jsx
@@ -108,6 +108,13 @@ class StepItem extends Component {
         if (shape === 'arrow') {
             return;
         }
+        const resetTailStyle = () => {
+            dom.setStyle(this.tail, {
+                width: '',
+                // eslint-disable-next-line
+                top: '',
+            });
+        };
 
         if (direction === 'vertical' || direction === 'ver') {
             this.resize();
@@ -124,13 +131,11 @@ class StepItem extends Component {
             ) {
                 // 调整横向Content
                 this.adjustTail();
+            } else {
+                resetTailStyle();
             }
         } else if (index !== total - 1) {
-            dom.setStyle(this.tail, {
-                width: '',
-                // eslint-disable-next-line
-                top: '',
-            });
+            resetTailStyle();
         }
     }
 

diff --git a/test/step/index-spec.js b/test/step/index-spec.js
@@ -274,15 +274,22 @@ describe('Step', () => {
 
             assert(wrapper.find('.next-step-label-vertical').length === 1);
             wrapper.setProps({ labelPlacement: 'horizontal' }, () => {
+                assert(wrapper.find('.next-step-label-horizontal').length === 1);
                 // 横向模式下会调整 next-step-item-tail 的宽度值
                 const $tail = wrapper.find('.next-step-item-tail');
                 assert(
                     $tail.length === 3 && 
                     $tail.at(0).instance().style.width !== "" &&
                     $tail.at(2).instance().style.width === ""
                 );
+                // 重新设置为垂直居中 应该去掉 next-step-item-tail 的宽度值
+                wrapper.setProps({labelPlacement: 'ver'}, () => {
+                    assert(
+                        $tail.length === 3 && 
+                        $tail.at(0).instance().style.width === ""
+                    );
+                });
             });
-            assert(wrapper.find('.next-step-label-horizontal').length === 1);
         });
 
         it('should trigger click event', () => {