项目地址

github地址

Introduction

1、埋点业务与主业务进行解耦（代码分离），依赖装饰器实现

2、支持框架Vue、React、Angular、小程序、原生js等项目使用

3、@after在主程序执行完毕后，再执行@after所装饰的函数

4、主要为埋点服务，更可应用到其他业务场景中

Installation

1# for Vue Angular React
2
3npm install better-burying-point --save-dev
4

1import { setModule, setSeparator, before, after } from 'better-burying-point';

Usage

用法一：

1// main.js
2import { setModule } from 'better-burying-point';
3// 设置模块
4setModule({
5    home: {
6        homePage(item, index) {
7            console.log(this); // 与handlerEvent函数内部的this指向相同
8        },
9        clickBtn(staticParamOne, staticParamTwo, item, index) {},
10        leave(staticParamOne, staticParamTwo, item, index) {}
11    }
12})
13
14// home.js
15import { before, after } from 'better-burying-point';
16const obj = {
17    @after('home.homePage')
18    handlerEvent(item, index){
19        console.log(this);
20    },
21    @after('home.clickBtn', staticParamOne, staticParamTwo) // 此处两个静态参数会与clickBtn函数的参数进行拼装，传递到home模块下clickBtn函数内
22    clickBtn(item, index){
23        console.log('点击');
24    },
25    @before('home.leave', staticParamOne, staticParamTwo)
26    goLink() {
27        window.loation.href = 'https://xxx.com.cn';
28    }
29}
30

用法二：按照模块化拆分

1// bury/modules/home.js
2export default {
3    homePage(item, index) {
4        console.log(this);
5    }
6}
7// bury/modules/detail.js
8export default {
9    detailPage(item, index) {
10        console.log(this);
11    }
12}
13// bury/index.js
14import home from './modules/home.js';
15import detail from './modules/detail.js';
16export default {
17    home,
18    detail
19}
20
21// 入口文件处设置 main.js
22import { setModule } from 'better-burying-point';
23import module from './bury/index';
24setModule(module);
25
26
27// home页面 使用
28var home = {
29    @after('home.homePage')
30    handlerEvent(item, index){
31        console.log(this);
32    }
33}

Options

setModule

Type: Function[Object]
设置拆分模块的对象，为页面访问使用,函数参数为对象

setSeparator

Type: Function[String]
Default: '.'
设置对象访问分隔符，函数参数为字符串，比如：home.leave；如果设置'/',访问home/leave

before

Type: Function[arg1 , arg2, arg3, ...]
before函数返回一个装饰器函数
第一个参数：必须为字符串，模块访问顺序 第二个参数：静态参数 ... 第n个参数：静态参数
【 备注：】主程序执行之前才执行装饰函数

after

Type: Function[arg1 , arg2, arg3, ...]
after函数返回一个装饰器函数
第一个参数：必须为字符串，模块访问顺序 第二个参数：静态参数 ... 第n个参数：静态参数
【 备注：】主程序执行之后才执行装饰函数

License

MIT