add(anchor): mode

demo/documentation/components/anchor/enUS/content.md

@@ -0,0 +1,6 @@
+# Test for mode
+```html
+<div style="height:50px">
+  Test for mode content
+</div>
+```

demo/documentation/components/anchor/enUS/index.md

@@ -4,8 +4,11 @@ These demos used to use some charactor names from *Hard-Boiled Wonderland and th
 ## Demos
 ```demo
 basic
+mode
+content
 affix
 scrollto
+
 ```
 ## Props
 |Name|Type|Default|Description|
@@ -13,6 +16,7 @@ scrollto
 |affix|`boolean`|`false`|If it works like a affix. If set to `true`, it will recieve props from [affix](n-affix#Props)|
 |target|`() => HTMLElement`|A function that returns the nearest scrollable ascendant element|The element that anchor listens to scroll event. (If you want affix & anchor to listen to different target, manually warp anchor in affix instead.)|
 |bound|`number`|`12`||
+|mode|`boolean \| string`|`ignore-gap`| If set to `false`, it will be displayed on the exact href |
 
 ## Methods
 |Name|Type|Description|

demo/documentation/components/anchor/enUS/mode.md

@@ -0,0 +1,16 @@
+# Mode
+```html
+<div style="height:200px">
+  <div style="width:160px;float:right;">
+    <n-anchor  affix :offset-top="24" :top="88" style="z-index: 1;" mode="ignore-gap">
+      <n-anchor-link title="Demos" href="#Demos">
+        <n-anchor-link title="Basic" href="#basic"/>
+        <n-anchor-link title="Mode" href="#mode"/>
+        <n-anchor-link title="Affix" href="#affix"/>
+        <n-anchor-link title="Scroll To" href="#scrollto"/>
+      </n-anchor-link>
+      <n-anchor-link title="Props" href="#Props" />
+    </n-anchor>
+  </div>
+</div>
+```

src/Anchor/src/AnchorAdapter.vue

@@ -4,6 +4,7 @@
     ref="anchor"
     :bound="bound"
     :target="target"
+    :mode="mode"
   >
     <slot />
   </n-base-anchor>
@@ -20,6 +21,7 @@
       ref="anchor"
       :bound="bound"
       :target="target"
+      :mode="mode"
     >
       <slot />
     </n-base-anchor>
@@ -68,6 +70,10 @@ export default {
     bound: {
       type: Number,
       default: 12
+    },
+    mode: {
+      type: [String, Boolean],
+      default: false
     }
   },
   methods: {

src/Anchor/src/BaseAnchor.vue

@@ -54,6 +54,10 @@ export default {
     bound: {
       type: Number,
       default: 12
+    },
+    mode: {
+      type: [String, Boolean],
+      default: false
     }
   },
   data () {
@@ -189,7 +193,11 @@ export default {
       const currentActiveHref = this.activeHref
       const activeLink = links.reduce((prevLink, link, index) => {
         if (link.top + link.height < 0) {
-          return prevLink
+          if (this.mode === 'ignore-gap') {
+            return link
+          } else {
+            return prevLink
+          }
         }
         if (link.top <= this.bound) {
           if (prevLink === null) {