README
v-scrollspy
A Vue scrollspy directive using the Intersection Observer API.
It's a thin wrapper of @jfm/scrollspy library.
Install
npm install v-scrollspy
Usage
<template>
<main>
<section id="1" v-scrollspy="onScrollTo">
<h1>1</h1>
<p>...</p>
</section>
<section id="2" v-scrollspy="onScrollTo">
<h1>2</h1>
<p>...</p>
</section>
<section id="3" v-scrollspy="onScrollTo">
<h1>3</h1>
<p>...</p>
</section>
</main>
</template>
<script>
import scrollspy from 'v-scrollspy'
export default {
directives: { scrollspy },
data: () => ({
active: ''
}),
methods: {
onScrollTo(el) {
this.active = el.id
}
}
}
</script>