概述
当今网页发展极速，如何了解用户是哪些页面最受欢迎、用户喜欢点击哪些按钮、最长停留页面等这些数据成为了每个网页需关注的重点。前端的指标分析常常成为了一个分析完成指标数据的重要手段。其中一种常用的方式是通过KISSmetrics这个工具进行分析。KISSmetrics 就是一个专门用于跟踪行为数据的工具。
Ember-kiss-metrics 的介绍
Ember-kiss-metrics 是针对于 Ember.js 框架而设计的一个插件来使用 KISSmetrics 工具，它可以让我们轻松记录特定行动的记录日志，再结合KISSmetrics的跟踪功能，获取更多用户数据以用于数据分析。
安装
通过 npm 安装 ember-kiss-metrics 插件很简单：
$ npm install --save-dev ember-kiss-metrics
配置
服务配置
在 app.js 文件中使用任何常用的 Ember-CLI 应用程序中，可以在这里导入和配置 ember-kiss-metrics：
// app/app.js import KissmetricsService from 'ember-kiss-metrics/services/kissmetrics';
设置 kiss_metrics_api_key（KISSmetrics API key，相关申请方法可参考KISSmetrics官方文档。）:
// app/app.js
KissmetricsService.reopen({
kiss_metrics_api_key: '2d199FDBSB15D961bb734d9'
});插件配置
一旦设置了服务，我们就可以使用插件模板助手来记录事件点击。插件模板助手非常简单，将KISSmetrics上的任意行动(包括标准事件和 事件参数）映射到 Ember 叅考书籍的行动，请在您的 Ember 模板中使用 kiss-event 属性。
<button {{kiss-event "Button Clicked"}}>Click me</button>在上面的示例中，我们在按钮上添加了 kiss-event 属性，并设置其行动名称为 "Button Clicked"。当用户单击按钮时，ember-kiss-metrics 将记录行动，并将其发送到 KISSmetrics API。
示例代码
以下是示例代码，其中包含JS、Hbs等各种能够比较直观反馈模板呈现效果的代码。
-- -------------------- ---- -------
------ ----- ---- --------
------ - ------ -- ------- - ---- -----------------
------ ------- -------------------------
------------ ----------
-------- -
--------------- -
-----------------------------------------------------
-
-
---<button {{action "buttonClicked"}}>Click me!</button>总结
通过以上步骤，您可以完成使用 ember-kiss-metrics 插件来使用 KISSmetrics 工具的配置，简单易操作，同时也可以获取到更加准确的数据用于数据分析。希望本篇文章能够对您有所帮助。具体实现，可下载代码运行学习。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e19a563576b7b1ecbda