一个简单的Vue.js方向，可在您滚动到特定元素时跟踪滚动事件和触发功能。

安装和下载：

# Yarn
$ yarn add vue-waypoint

# NPM
$ npm i vue-waypoint --save

基本用法：

1.在Vue之后导入VueWaypoint。

import Vue from 'vue'
import VueWaypoint from 'vue-waypoint'

2.注册插件。

Vue.use(VueWaypoint)

3.基本用法：

<template>
  <div v-waypoint="{ active: true, callback: onWaypoint, options: intersectionOptions }"></div>
</template>

export default {
  data: () => ({
    intersectionOptions: {
      root: null,
      rootMargin: '0px 0px 0px 0px',
      threshold: [0, 1] 
    } 
  })
  methods: {
    onWaypoint ({ going, direction }) {
      // going: in, out
      // direction: top, right, bottom, left
      if (going === this.$waypointMap.GOING_IN) {
        console.log('路标的!')
      }
      if (direction === this.$waypointMap.DIRECTION_TOP) {
        console.log('路标会最高!')
      }
    }
  }
}

变更日志：

v4.0.0 (06/21/2021)

• feat：vue3 支持

---

官网：https://github.com/scaccogatto/vue-waypoint

演示：https://www.vue365.cn/code_demo.php?id=1882

GitHub下载：https://github.com/scaccogatto/vue-waypoint/archive/master.zip