Spm-fe NPM | npm.io

Spm

import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';
import Spm from '../src/index';

new Spm({
  appType: 'aiSearch',
  onEventListener: (data, type) => {
    console.log(type, data)
  }
})

const Home = () => {
  return (
    <div data-spm-page="test-page-home" page-spm-url="/">
      <div data-spm-pagesize="10" page-spm-url2="12334453545" data-spm-pageno="1" data-spm-query="撒个娇">
        <div data-spm-module="test-module" data-spm-index="2">
          Home
          <Link data-spm-event="test-event-/readme" to='/readme'>切换路由</Link>
        </div>
      </div>
    </div>
  )
}

const Readme = () => {
  return (
    <div data-spm-page="test-page-readme" page-spm-url="/readme">
      <div data-spm-pagesize="10" page-spm-url2="12334453545" data-spm-pageno="1" data-spm-query="撒个娇">
        <div data-spm-module="test-module" data-spm-index="2">
          Readme
          <Link data-spm-event="test-event-/" to='/'>切换路由</Link>
        </div>
      </div>
    </div>
  )
}
const App = () => {
  return (
    <Router>
      <Switch>
        <Route key="readme" path="/readme" exact component={Readme} />
        <Route key="home" path="/" component={Home} />
      </Switch>
    </Router>
  );
};

render(
  <App />,
  document.getElementById('Test'),
);

API

参数	类型	说明	必填	默认值
appType	string	应用名称	是	-
pageSpmName	string	页面埋点命名	否	'data-spm-page'
moduleSpmName	string	模块埋点命名	否	'data-spm-module'
eventSpmName	string	事件埋点命名	否	'data-spm-event'
pageSessionName	string	页面埋点在缓存中的名称	否	'spmPage'
moduleSessionName	string	模块埋点在缓存中的名称	否	'spmModule'
eventSessionName	string	事件埋点在缓存中的名称	否	'spmEvent'
fromApp	string	url传参三方应用名称的key	否	'from_app'
fromAppFix	boolean	fromApp是否常驻	否	false
headerSpm	string	header埋点参数命名,a.b.c.d	否	'log-spm'
onEventListener	Function(data: 埋点数据, type: (Listener Types)) => void	事件监听触发	否	-
listenerEvents	string[]	页面中需要监听的事件	否	'click', 'keyup'
isHash	boolean	是否hash路由	否	false
onLoadTimeMax	number	页面onLoad时间上限，超过上限获取页面加载时埋点会失败，单位：毫秒	否	5000
onError	Function(errMsg: string, type: (Listener Types)) => void	监听触发失败回调	否	-