Spm
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import Spm from 'ai-search-spm';
const spm = new Spm({
appType: 'aiSearch',
isHash: true,
onPageLoad: (headerParams) => {
console.log('onPageLoad:', headerParams)
},
onEventListener: (headerParams) => {
console.log('onEventListener:', headerParams)
}
})
class App extends Component {
componentDidMount() {
}
render() {
return (
<div data-spm-page="test-page">
<div data-spm-module="test-module">
<a data-spm-event="test-event" onClick={() => {
history.pushState(null, null, '/#/readme')
}}>123</a>
</div>
</div>
);
}
}
ReactDOM.render((
<App />
), mountNode);
props
| 参数 |
类型 |
说明 |
必填 |
默认值 |
| 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' |
| headerSpm |
string |
header埋点参数命名,a.b.c.d |
否 |
'log-spm' |
| headerFromApp |
string |
header参数命名:来源应用 |
否 |
'log-from-app' |
| headerFromPage |
string |
header参数命名:来源页面 |
否 |
'log-from-page' |
| headerFromModule |
string |
header参数命名:来源模块 |
否 |
'log-from-module' |
| headerFromEvent |
string |
header参数命名:来源事件 |
否 |
'log-from-event' |
| headerVisitType |
string |
header参数命名:请求发生时的类型 page/event |
否 |
'log-visit-type' |
| onPageLoad |
Function(headerParams:按照header参数命名) => void |
页面加载时调用一次 |
否 |
- |
| onEventListener |
Function(headerParams:按照header参数命名) => void |
事件监听触发 |
否 |
- |
| listenerEvents |
string[] |
页面中需要监听的事件 |
否 |
['click', 'keyup'] |
| isHash |
boolean |
是否hash路由 |
否 |
false |
| fromParams |
boolean |
是否支持from参数 |
否 |
false |