From b0851bd6c48d07df9429aaee08228496e2dd3b7b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A9=86=E5=BB=BA=E5=9B=BD?= <980751937@qq.com>
Date: Wed, 29 Nov 2017 15:32:38 +0800
Subject: [PATCH] Update SwipeableTabBarMixin.js
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

/**
   * 修复`totalAvaliableDelta` & `tabWidth` 计算不准的bug
   * 当 `panels` 动态变化时，比如增加时，最后一页`panels`出现定位错误。
   * 因为`totalAvaliableDelta`的值始终不变导致了此bug.
   *
   * 解决办法，在`componentWillReceiveProps`里面, 及时更新；
   */
---
 src/SwipeableTabBarMixin.js | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/SwipeableTabBarMixin.js b/src/SwipeableTabBarMixin.js
index c7ad335c..5163d5f2 100755
--- a/src/SwipeableTabBarMixin.js
+++ b/src/SwipeableTabBarMixin.js
@@ -86,25 +86,35 @@ export default {
     const { totalDelta, vertical } = this.cache;
     setPxStyle(this.swipeNode, totalDelta, vertical);
   },
-  componentDidMount() {
-    const { swipe, nav } = this;
+  updatePropsSwipeComponent() {
+    const { swipe, nav } = this.refs;
     const { tabBarPosition, pageSize, panels, activeKey } = this.props;
     this.swipeNode = ReactDOM.findDOMNode(swipe); // dom which scroll (9999px)
     this.realNode = ReactDOM.findDOMNode(nav); // dom which visiable in screen (viewport)
     const _isVertical = isVertical(tabBarPosition);
     const _viewSize = getStyle(this.realNode, _isVertical ? 'height' : 'width');
     const _tabWidth = _viewSize / pageSize;
-    this.cache = {
+    
+    return {
       vertical: _isVertical,
       totalAvaliableDelta: _tabWidth * panels.length - _viewSize,
       tabWidth: _tabWidth,
-    };
+    }
+  },
+  componentDidMount() {
+    const { activeKey } = this.props;
+    
+    this.cache = this.updatePropsSwipeComponent();
     this.setSwipePositionByKey(activeKey);
   },
   componentWillReceiveProps(nextProps) {
     if (nextProps.activeKey && nextProps.activeKey !== this.props.activeKey) {
       this.setSwipePositionByKey(nextProps.activeKey);
     }
+    
+    const updateCache = this.updatePropsSwipeComponent();
+    this.cache.totalAvaliableDelta = updateCache.totalAvaliableDelta;
+    this.cache.tabWidth = updateCache.totalAvaliableDelta;
   },
   onPan(e) {
     const { vertical, totalAvaliableDelta, totalDelta } = this.cache;