hero

vue intersection plugin

模块曝光埋点解决方案

Get Started →

简单易用

仅仅是一个vue plugin和一个指令

非阻塞,高性能

使用IntersectionObserver(不阻塞主线程),不支持IntersectionObserver 使用scroll+函数节流+setTimeout

稳定

严格测试

Quick Setup

install

# install with npm
npm install vue-intersection-plugin

# install with yarn
yarn add vue-intersection-plugin

Use

import vueIntersectionPlugin from "vue-intersection-plugin";
Vue.use(vueIntersectionPlugin, {
    handler: (logData)=> {
        // your logic code
    },
    duration: 3000, //在页面可视区域停留时长 
    // threshold: []
});

// add directive
<YourComponent>
    <div
        v-intersection
        :data-log="JSON.stringify({
            //your log data
        })"
        >
    
    </div>
</YourComponent>