事件追踪

自 v2.0.0 版本可用

除了页面浏览量，Umami 还能够追踪发生在您网站上的事件。在 Umami 中记录事件有两种方式，使用 data attributes 属性或使用 JavaScript。

限制

To enable events, just add a special data attribute to the element you want to track.

For example, you might have a button like this:

<button id="signup-button">Sign up</button>

Add a data attribute in the following format:

data-umami-event="{event-name}"

So your button element should now be:

<button id="signup-button" data-umami-event="Signup button">Sign up</button>

When a user clicks this button, Umami will record an event named Signup button.

You can also pass event data (event_data) through data-umami-event-* annotations.

data-umami-event="Signup button"
data-umami-event-email="bob@aol.com"
data-umami-event-id="123"

These additional attributes will cause the recorded event data to be { email: 'bob@aol.com', id: '123' }, with the event name Signup button.

With this method, all event data is saved as strings. If you want to save event data of types such as numbers, dates, or booleans, please use the JavaScript method below.
Other event listeners inside the element will not be triggered.

你也可以使用 window.umami 对象手动记录事件。实现与上述数据属性方法相同的效果，可以这样写：

const button = document.getElementById('signup-button');

button.onclick = () => umami.track('Signup 按钮');

在这种情况下，Umami 会记录一个名为 Signup 按钮 的事件。

如果你想记录动态数据，请参阅追踪器函数。

事件记录后，可以在你网站的 事件（Events） 页面查看。

你保存的自定义数据可以在事件页的 属性（Properties） 选项卡中访问。该部分将展示你保存的所有自定义数据属性以及各个值的分类情况。

使用筛选面板可按特定属性名称和值缩小事件属性的范围。这样你就可以将分析重点放在特定的一组事件上。