mini-ali-ui-rpx - npm Package Compare versions

Comparing version 1.3.4 to 1.3.5

CHANGELOG.md

@@ -0,1 +1,8 @@
+## 1.3.5
+`2021-04-22`
+* **Fixed**：
+  * vtabs 组件的 swipeable 为false时，点击事件失效
+  * tabs 组件的 activeTab 值更新，组件切换异常
+  * swipe-action 组件的数值检测
+
 ## 1.3.4
@@ -2,0 +9,0 @@ `2021-03-23`

es/swipe-action/index.js

@@ -105,2 +105,4 @@ import fmtUnit from '../_util/fmtUnit';
         my.createSelectorQuery().select(".am-swipe-movable-area-" + this.$id).boundingClientRect().exec(function (ret) {
+          if (!ret) return;
+
           _this3.setData({
@@ -107,0 +109,0 @@ height: parseInt(ret[0].height, 0)

es/tabs/index.js

@@ -0,1 +1,3 @@
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import fmtUnit from '../_util/fmtUnit';
@@ -74,3 +76,4 @@ Component({
     tabFontSize13: fmtUnit('13px'),
-    _showPlus: false
+    _showPlus: false,
+    tabsWidthArr: []
   },
@@ -80,68 +83,96 @@ didMount: function didMount() {
 
-    var _this$props = this.props,
-        tabs = _this$props.tabs,
-        animation = _this$props.animation,
-        hasSubTitle = _this$props.hasSubTitle,
-        elevator = _this$props.elevator,
-        showPlus = _this$props.showPlus;
+    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _this$props, tabs, animation, hasSubTitle, elevator, showPlus, floorNumber, boxWidth, elWidth, elLeft;
 
-    if (tabs.length !== 0 || !tabs) {
-      this.setData({
-        _showPlus: showPlus
-      });
-      this.setWindowWidth();
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _this$props = _this.props, tabs = _this$props.tabs, animation = _this$props.animation, hasSubTitle = _this$props.hasSubTitle, elevator = _this$props.elevator, showPlus = _this$props.showPlus;
 
-      if (hasSubTitle) {
-        this.setData({
-          capsule: true
-        });
-      }
+              if (!(tabs.length !== 0 || !tabs)) {
+                _context.next = 18;
+                break;
+              }
 
-      this.setData({
-        tabWidth: tabs.length > 3 ? 0.25 : 1 / tabs.length,
-        animation: animation,
-        autoplay: true
-      });
+              _this.setData({
+                _showPlus: showPlus
+              });
 
-      if (elevator) {
-        this.setData({
-          swipeable: false
-        }); // 记录电梯组件总高度，并写入 data
+              _this.setWindowWidth();
 
-        my.createSelectorQuery().select('#am-tabs-elevator-content').boundingClientRect().exec(function (ret) {
-          _this.setData({
-            elevatorHeight: ret[0].height
-          });
-        }); // 获取电梯组件每个 pane 的 top 值
+              if (hasSubTitle) {
+                _this.setData({
+                  capsule: true
+                });
+              }
 
-        this.getElevatorHeight(tabs);
-      } // 初始状态下，如果 activeTab 数值较大，会将后面的 tab 前移
+              _this.setData({
+                tabWidth: tabs.length > 3 ? 0.25 : 1 / tabs.length,
+                animation: animation,
+                autoplay: true
+              });
 
+              if (!elevator) {
+                _context.next = 13;
+                break;
+              }
 
-      var boxWidth = 0;
-      var elWidth = 0;
-      var elLeft = 0;
-      my.createSelectorQuery().select("#tabs-item-" + this.props.tabsName + "-" + this.props.activeTab).boundingClientRect().exec(function (ret) {
-        elWidth = ret[0].width;
-        elLeft = ret[0].left;
+              _this.setData({
+                swipeable: false
+              }); // 记录电梯组件总高度，并写入 data
 
-        _this.setData({
-          elWidth: elWidth,
-          elLeft: elLeft
-        });
-      });
-      my.createSelectorQuery().select("#am-tabs-bar-" + this.props.tabsName + "-content").boundingClientRect().exec(function (ret) {
-        boxWidth = ret[0].width;
 
-        _this.setData({
-          boxWidth: boxWidth
-        });
+              my.createSelectorQuery().select('#am-tabs-elevator-content').boundingClientRect().exec(function (ret) {
+                _this.setData({
+                  elevatorHeight: ret[0].height
+                });
+              }); // 获取电梯组件每个 pane 的 top 值
 
-        setTimeout(function () {
-          _this.setData({
-            viewScrollLeft: Math.floor(_this.data.elWidth + _this.data.elLeft - _this.data.boxWidth)
-          });
-        }, 300);
-      });
-    }
+              _context.next = 11;
+              return _this.getElevatorHeight(tabs);
+
+            case 11:
+              floorNumber = _context.sent;
+              // 滚动到指定是初始位置
+              my.pageScrollTo({
+                scrollTop: Math.ceil(floorNumber[_this.props.activeTab]),
+                duration: 1
+              });
+
+            case 13:
+              // 初始状态下，如果 activeTab 数值较大，会将后面的 tab 前移
+              boxWidth = 0;
+              elWidth = 0;
+              elLeft = 0;
+              my.createSelectorQuery().select("#tabs-item-" + _this.props.tabsName + "-" + _this.props.activeTab).boundingClientRect().exec(function (ret) {
+                elWidth = ret[0].width;
+                elLeft = ret[0].left;
+
+                _this.setData({
+                  elWidth: elWidth,
+                  elLeft: elLeft
+                });
+              });
+              my.createSelectorQuery().select("#am-tabs-bar-" + _this.props.tabsName + "-content").boundingClientRect().exec(function (ret) {
+                boxWidth = ret[0].width;
+
+                _this.setData({
+                  boxWidth: boxWidth
+                });
+
+                setTimeout(function () {
+                  _this.setData({
+                    viewScrollLeft: Math.floor(_this.data.elWidth + _this.data.elLeft - _this.data.boxWidth)
+                  });
+                }, 300);
+              });
+
+            case 18:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }))();
   },
@@ -154,3 +185,5 @@ didUpdate: function didUpdate(prevProps, prevData) {
         elevator = _this$props2.elevator,
-        showPlus = _this$props2.showPlus;
+        showPlus = _this$props2.showPlus,
+        currentActiveTab = _this$props2.activeTab,
+        tabsName = _this$props2.tabsName;
     this.setData({
@@ -192,2 +225,65 @@ _showPlus: showPlus
       }
+
+      if (currentActiveTab !== prevProps.activeTab) {
+        this.setData({
+          tabViewNum: currentActiveTab,
+          prevTabViewNum: prevData.tabViewNum
+        });
+        my.pageScrollTo({
+          scrollTop: Math.ceil(this.data.floorNumber[currentActiveTab]),
+          duration: 1
+        });
+      }
+    } else if (currentActiveTab !== prevProps.activeTab) {
+      var boxWidth = 0;
+      var elWidth = 0;
+      var elLeft = 0;
+      var className = "am-tabs-bar-tab " + (!this.props.hasSubTitle && this.props.capsule ? 'am-tabs-bar-tab-capsule' : '') + " " + (this.props.hasSubTitle ? 'am-tabs-bar-tab__hasSubTitle' : '') + " " + this.props.tabBarCls;
+      my.createSelectorQuery().selectAll("." + className).boundingClientRect().exec(function (ret) {
+        _this2.setData({
+          tabsWidthArr: ret[0].map(function (item) {
+            return item.width;
+          })
+        });
+      });
+      my.createSelectorQuery().select("#tabs-item-" + tabsName + "-" + currentActiveTab).boundingClientRect().exec(function (ret) {
+        elWidth = ret[0].width;
+        elLeft = ret[0].left;
+
+        _this2.setData({
+          elWidth: elWidth,
+          elLeft: elLeft
+        });
+      });
+      my.createSelectorQuery().select("#am-tabs-bar-" + tabsName + "-content").boundingClientRect().exec(function (ret) {
+        boxWidth = ret[0].width;
+
+        _this2.setData({
+          boxWidth: boxWidth
+        }); // mock el.offsetLeft
+
+
+        var elOffeseLeft = _this2.data.tabsWidthArr.reduce(function (prev, cur, index) {
+          if (index < _this2.props.activeTab) {
+            // eslint-disable-next-line no-param-reassign
+            prev += cur;
+          }
+
+          return prev;
+        }, 0);
+
+        if (_this2.data.elWidth > _this2.data.boxWidth / 2) {
+          setTimeout(function () {
+            _this2.setData({
+              viewScrollLeft: elOffeseLeft - 40
+            });
+          }, 300);
+        } else {
+          setTimeout(function () {
+            _this2.setData({
+              viewScrollLeft: elOffeseLeft - Math.floor(_this2.data.boxWidth / 2)
+            });
+          }, 300);
+        }
+      });
     }
@@ -210,30 +306,36 @@ },
 
-      var _loop = function _loop(i) {
-        my.createSelectorQuery().select("#am-tabs-elevator-pane-" + i).boundingClientRect().select('.am-tabs-bar-sticky').boundingClientRect().exec(function (ret) {
-          var _this4$props = _this4.props,
-              elevatorTop = _this4$props.elevatorTop,
-              elevatorContentTop = _this4$props.elevatorContentTop;
-          var tabContentDistance = 0;
+      return new Promise(function (resolve) {
+        var _loop = function _loop(i) {
+          my.createSelectorQuery().select("#am-tabs-elevator-pane-" + i).boundingClientRect().select('.am-tabs-bar-sticky').boundingClientRect().exec(function (ret) {
+            var _this4$props = _this4.props,
+                elevatorTop = _this4$props.elevatorTop,
+                elevatorContentTop = _this4$props.elevatorContentTop;
+            var tabContentDistance = 0;
 
-          if (elevatorTop.match(/\d+px/)) {
-            tabContentDistance = parseInt(elevatorTop, 10);
-          } else {
-            tabContentDistance = parseInt(elevatorContentTop, 10);
-          }
+            if (elevatorTop.match(/\d+px/)) {
+              tabContentDistance = parseInt(elevatorTop, 10);
+            } else {
+              tabContentDistance = parseInt(elevatorContentTop, 10);
+            }
 
-          _this4.props.floorNumber[i] = ret[0].top - ret[1].height - tabContentDistance;
+            _this4.props.floorNumber[i] = ret[0].top - ret[1].height - tabContentDistance;
 
-          _this4.setData({
-            floorNumber: _this4.props.floorNumber
+            _this4.setData({
+              floorNumber: _this4.props.floorNumber
+            });
+
+            if (i === tabs.length - 1) {
+              resolve(_this4.props.floorNumber);
+            }
           });
-        });
-      };
+        };
 
-      for (var i = 0; i < tabs.length; i++) {
-        _loop(i);
-      }
+        for (var i = 0; i < tabs.length; i++) {
+          _loop(i);
+        }
 
-      setTimeout(function () {
-        _this4.$page.data.floorNumber = _this4.data.floorNumber;
-      }, 100);
+        setTimeout(function () {
+          _this4.$page.data.floorNumber = _this4.data.floorNumber;
+        }, 100);
+      });
     },
@@ -261,33 +363,3 @@ handleSwiperChange: function handleSwiperChange(e) {
           floor = _e$target$dataset.floor;
-      var boxWidth = 0;
-      var elWidth = 0;
-      my.createSelectorQuery().select("#" + e.currentTarget.id).boundingClientRect().exec(function (ret) {
-        elWidth = ret[0].width;
 
-        _this5.setData({
-          elWidth: elWidth
-        });
-      });
-      my.createSelectorQuery().select("#am-tabs-bar-" + tabsName + "-content").boundingClientRect().exec(function (ret) {
-        boxWidth = ret[0].width;
-
-        _this5.setData({
-          boxWidth: boxWidth
-        });
-
-        if (_this5.data.elWidth > _this5.data.boxWidth / 2) {
-          setTimeout(function () {
-            _this5.setData({
-              viewScrollLeft: e.currentTarget.offsetLeft - 40
-            });
-          }, 300);
-        } else {
-          setTimeout(function () {
-            _this5.setData({
-              viewScrollLeft: e.currentTarget.offsetLeft - Math.floor(_this5.data.boxWidth / 2)
-            });
-          }, 300);
-        }
-      });
-
       if (this.props.onTabClick && !this.props.elevator) {
@@ -294,0 +366,0 @@ this.props.onTabClick({

es/vtabs/index.js

@@ -7,3 +7,5 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
     tabTop: 0,
-    wrapScrollTop: 0,
+    wrapScrollTop: {
+      _v: 0
+    },
     besideRadius: fmtUnit('8px')
@@ -10,0 +12,0 @@ },

package.json

@@ -1,1 +0,1 @@
-{"name":"mini-ali-ui-rpx","version":"1.3.4","description":"小程序版AntUI rpx 版本","repository":{"type":"git","url":"[e-mail]:Alibaba-mp/mini-ali-ui.git"},"files":["es"],"keywords":["antui","mini-program","mini-ali-ui","ali-ui"],"license":"MIT","devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-syntax-dynamic-import":"^7.0.0","@babel/plugin-transform-runtime":"^7.11.5","@babel/preset-env":"^7.6.3","@babel/preset-typescript":"^7.6.0","@typescript-eslint/parser":"^2.17.0","alipay-style":"^0.1.0","eslint":"^5.16.0","eslint-config-ali":"^3.1.0","eslint-plugin-import":"^2.11.0","eslint-plugin-typescript":"^0.14.0","gulp":"^4.0.0","gulp-babel":"^8.0.0","gulp-clean-css":"^4.0.0","gulp-if":"^2.0.2","gulp-inject-envs":"^1.1.1","gulp-less":"^4.0.1","gulp-rename":"^1.2.3","lint-staged":"^8.2.0","mini-types":"^0.0.1","pre-commit":"^1.2.2","stylelint":"^10.1.0","stylelint-config-standard":"^18.2.0","typescript":"^3.6.4"},"dependencies":{"@babel/runtime":"^7.11.2"},"scripts":{"lint-staged":"lint-staged","build":"yarn && NODE_ENV=production node scripts/compiler.js","pub":"npm run build && node scripts/pub.js","dev":"yarn && node scripts/compiler.js","build:rpx":"yarn && NODE_ENV=production node scripts/compiler.js --rpx","pub:rpx":"npm run build:rpx && node scripts/pub.js --rpx","dev:rpx":"yarn && node scripts/compiler.js --rpx"},"pre-commit":["lint-staged"],"lint-staged":{"*.ts":["eslint --ext .ts","git add"],"*.js":["eslint","git add"],"*.less":["stylelint --syntax less"]}}
+{"name":"mini-ali-ui-rpx","version":"1.3.5","description":"小程序版AntUI rpx 版本","repository":{"type":"git","url":"[e-mail]:Alibaba-mp/mini-ali-ui.git"},"files":["es"],"keywords":["antui","mini-program","mini-ali-ui","ali-ui"],"license":"MIT","devDependencies":{"@babel/core":"^7.6.4","@babel/plugin-syntax-dynamic-import":"^7.0.0","@babel/plugin-transform-runtime":"^7.11.5","@babel/preset-env":"^7.6.3","@babel/preset-typescript":"^7.6.0","@typescript-eslint/parser":"^2.17.0","alipay-style":"^0.1.0","eslint":"^5.16.0","eslint-config-ali":"^3.1.0","eslint-plugin-import":"^2.11.0","eslint-plugin-typescript":"^0.14.0","gulp":"^4.0.0","gulp-babel":"^8.0.0","gulp-clean-css":"^4.0.0","gulp-if":"^2.0.2","gulp-inject-envs":"^1.1.1","gulp-less":"^4.0.1","gulp-rename":"^1.2.3","lint-staged":"^8.2.0","mini-types":"^0.0.1","pre-commit":"^1.2.2","stylelint":"^10.1.0","stylelint-config-standard":"^18.2.0","typescript":"^3.6.4"},"dependencies":{"@babel/runtime":"^7.11.2"},"scripts":{"lint-staged":"lint-staged","build":"yarn && NODE_ENV=production node scripts/compiler.js","pub":"npm run build && node scripts/pub.js","dev":"yarn && node scripts/compiler.js","build:rpx":"yarn && NODE_ENV=production node scripts/compiler.js --rpx","pub:rpx":"npm run build:rpx && node scripts/pub.js --rpx","dev:rpx":"yarn && node scripts/compiler.js --rpx"},"pre-commit":["lint-staged"],"lint-staged":{"*.ts":["eslint --ext .ts","git add"],"*.js":["eslint","git add"],"*.less":["stylelint --syntax less"]}}

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

355203

increased by0.92%

Lines of code

4402

increased by1.48%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes