2019-12-09 12:49:51 +08:00
|
|
|
# Scroll To
|
|
|
|
|
```html
|
|
|
|
|
<div style="height: 200px; padding-left: 200px;">
|
2020-01-29 20:51:51 +08:00
|
|
|
<n-anchor affix :offset-top="24" :top="88" :bound="24" style="z-index: 1;" ref="anchor">
|
|
|
|
|
<n-anchor-link title="Demos" href="#Demos">
|
|
|
|
|
<n-anchor-link title="Basic" href="#basic"/>
|
2020-02-18 17:42:00 +08:00
|
|
|
<n-anchor-link title="Ignore-Gap" href="#ignore-gap"/>
|
2020-01-29 20:51:51 +08:00
|
|
|
<n-anchor-link title="Affix" href="#affix"/>
|
|
|
|
|
<n-anchor-link title="Scroll To" href="#scrollto"/>
|
2019-12-09 12:49:51 +08:00
|
|
|
</n-anchor-link>
|
2020-01-29 20:51:51 +08:00
|
|
|
<n-anchor-link title="Props" href="#Props" />
|
2019-12-09 12:49:51 +08:00
|
|
|
</n-anchor>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding-left: 400px;">
|
2020-01-29 20:51:51 +08:00
|
|
|
<n-button @click="scrollTo('#basic')">Basic</n-button>
|
|
|
|
|
<n-button @click="scrollTo('#affix')">Affix</n-button>
|
2019-12-09 12:49:51 +08:00
|
|
|
</div>
|
|
|
|
|
```
|
|
|
|
|
```js
|
|
|
|
|
export default {
|
|
|
|
|
methods: {
|
|
|
|
|
scrollTo (href) {
|
|
|
|
|
this.$refs.anchor.scrollTo(href)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
```css
|
|
|
|
|
.n-button {
|
|
|
|
|
margin: 0 8px 12px 0;
|
|
|
|
|
}
|
|
|
|
|
```
|
