ChinaBigPan/vue-observe-visibility-docs-cn

检测元素在页面上变得可见或隐藏的时机(vue 指令)

vue-observe-visibility 中文文档

中文文档

英文原地址

npm install --save vue-observe-visibility

注意: 这个插件使用的Intersection Observer API并不是所有浏览器都支持的(目前Edge、Firefox和Chrome都支持)。您需要使用polyfill使它在不兼容的浏览器能够正常工作。

引入

import Vue from 'vue'
import VueObserveVisibility from 'vue-observe-visibility'

Vue.use(VueObserveVisibility)

或：

import Vue from 'vue'
import { ObserveVisibility } from 'vue-observe-visibility'

Vue.directive('observe-visibility', ObserveVisibility)

浏览器

<script src="vue.js"></script>
<script src="https://unpkg.com/vue-observe-visibility/dist/vue-observe-visibility.min.js"></script>

插件可以自动安装。如果没有，您可以按照下面的说明手动安装它。

加载指令。

Vue.use(VueObserveVisibility)

使用特定指令：

Vue.directive('observe-visibility', VueObserveVisibility.ObserveVisibility)