@rsuite/document-nav - npm Package Compare versions

Comparing version 1.0.15 to 1.0.17

lib/Nav.js

@@ -83,3 +83,4 @@ 'use strict';
           fixed = _props.fixed,
-          showOrderNumber = _props.showOrderNumber;
+          showOrderNumber = _props.showOrderNumber,
+          basePath = _props.basePath;
       var _state = this.state,
@@ -93,3 +94,4 @@ anchors = _state.anchors,
         activeAnchor: activeAnchor,
-        showOrderNumber: showOrderNumber
+        showOrderNumber: showOrderNumber,
+        basePath: basePath
       };
@@ -160,2 +162,4 @@ }
       this.scrollListener = (0, _throttle2.default)(function () {
+        var basePath = _this2.props.basePath;
+
         var index = 0;
@@ -170,4 +174,7 @@ var activeAnchor = _this2.state.activeAnchor;
           index = i;
-          return position.top > 0;
+          // 在 windows 电脑中点击锚点跳转后定位的元素，它的 position.top 不是 0，而是一个大于 0 小于 1 的数，所有需要减去 1，来兼容这种情况
+          // 而在 mac 电脑中这个值为 0，0 本来就不大于 0，所以即使减去 1 也对原有的逻辑没有影响，实际情况中也不会存在锚点行高为 1 的元素
+          return position.top - 1 > 0;
         });
+        // 第一个 position.top 大于 0 的元素，它的上一个元素便是需要被激活的导航
         var nextAnchor = anchors[index - 1] || anchors[0];
@@ -178,3 +185,3 @@ if (nextAnchor !== activeAnchor && _this2.pageNav) {
           });
-          var nav = document.querySelector('a[href=\'#' + nextAnchor + '\']');
+          var nav = document.querySelector('a[href=\'' + basePath + '#' + nextAnchor + '\']');
           var pageNav = _this2.pageNav;
@@ -388,5 +395,6 @@ if (nav && pageNav) {
   once: true,
-  rtl: false
+  rtl: false,
+  basePath: ''
 };
 Nav.Item = _NavItem2.default;
 exports.default = Nav;

lib/NavItem.js

@@ -86,3 +86,4 @@ 'use strict';
           activeAnchor = _props3.activeAnchor,
-          showOrderNumber = _props3.showOrderNumber;
+          showOrderNumber = _props3.showOrderNumber,
+          basePath = _props3.basePath;
 
@@ -97,3 +98,3 @@ var active = anchor === activeAnchor;
           {
-            href: '#' + anchor,
+            href: basePath + '#' + anchor,
             className: 'nav-link ' + (active ? 'active' : '') + ' scroll-bar-' + scrollBar,
@@ -100,0 +101,0 @@ style: _defineProperty({}, rtl ? 'paddingRight' : 'paddingLeft', (level - 1) * 20 + BASE_PADDING_LEFT + 'px')

package.json

 {
   "name": "@rsuite/document-nav",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "description": "Document navigation is automatically generated based on the HTML title (h1-h6) tag",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -124,2 +124,3 @@ # Document Nav
 | deep            | number `(10)`                      | 解析的 DOM 深度，避免和标题无关的 DOM 层级过深导致的性能损耗                                           |
+| basePath        | string`('')`                       | 通过传入 basePath，来支持使用了 base 标签 的场景                                                       |
 
@@ -126,0 +127,0 @@ ### `<Nav.Item>`

src/Nav.js

@@ -30,3 +30,5 @@ // @flow
   showOrderNumber: boolean,
-  rtl: boolean
+  rtl: boolean,
+  /** 通过传入 basePath 来支持使用 base 标签的场景 */
+  basePath: string
 };
@@ -60,3 +62,4 @@
     once: true,
-    rtl: false
+    rtl: false,
+    basePath: ''
   };
@@ -85,3 +88,3 @@
   getContext() {
-    const { scrollBar, fixed, showOrderNumber } = this.props;
+    const { scrollBar, fixed, showOrderNumber, basePath } = this.props;
     const { anchors, activeAnchor = fixed ? anchors[0] : '' } = this.state;
@@ -91,3 +94,4 @@ return {
       activeAnchor,
-      showOrderNumber
+      showOrderNumber,
+      basePath
     };
@@ -146,2 +150,3 @@ }
     this.scrollListener = throttle(() => {
+      const { basePath } = this.props;
       let index = 0;
@@ -155,4 +160,7 @@ const { activeAnchor } = this.state;
         index = i;
-        return position.top > 0;
+        // 在 windows 电脑中点击锚点跳转后定位的元素，它的 position.top 不是 0，而是一个大于 0 小于 1 的数，所有需要减去 1，来兼容这种情况
+        // 而在 mac 电脑中这个值为 0，0 本来就不大于 0，所以即使减去 1 也对原有的逻辑没有影响，实际情况中也不会存在锚点行高为 1 的元素
+        return position.top - 1 > 0;
       });
+      // 第一个 position.top 大于 0 的元素，它的上一个元素便是需要被激活的导航
       const nextAnchor = anchors[index - 1] || anchors[0];
@@ -163,3 +171,3 @@ if (nextAnchor !== activeAnchor && this.pageNav) {
         });
-        const nav = document.querySelector(`a[href='#${nextAnchor}']`);
+        const nav = document.querySelector(`a[href='${basePath}#${nextAnchor}']`);
         const pageNav = this.pageNav;
@@ -287,6 +295,4 @@ if (nav && pageNav) {
       if (pageNav) {
-        pageNav.style.height = `${
-          itemHeight *
-          parseInt((window.innerHeight - (offset.top || offset.bottom) - 60) / itemHeight, 10)
-        }px`;
+        pageNav.style.height = `${itemHeight *
+          parseInt((window.innerHeight - (offset.top || offset.bottom) - 60) / itemHeight, 10)}px`;
       }
@@ -293,0 +299,0 @@ };

src/NavItem.js

@@ -51,3 +51,3 @@ // @flow
     const { title, anchor, subItems, children, index, level, rtl } = this.props;
-    const { scrollBar = 'right', activeAnchor, showOrderNumber } = this.props;
+    const { scrollBar = 'right', activeAnchor, showOrderNumber, basePath } = this.props;
     const active = anchor === activeAnchor;
@@ -58,3 +58,3 @@ const content = showOrderNumber ? `${index} ${title}` : title;
         <a
-          href={`#${anchor}`}
+          href={`${basePath}#${anchor}`}
           className={`nav-link ${active ? 'active' : ''} scroll-bar-${scrollBar}`}
@@ -61,0 +61,0 @@ style={{

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

54370

increased by2.89%

Lines of code

1230

increased by1.15%

Number of lines in readme file

137

increased by0.74%

No dependency changes