@adapt-retail/adapt-event 中文文档教程

Question

@adapt-retail/adapt-data

⚠️ 此软件包尚未作为稳定版本发布，可能会发生变化。

在 Adapt Retail 中轻松调度事件。

• Install
• Usage
  • Import
  • Dispatch events
• Plugins
  • Default plugins
• Development

Install

npm install @adapt-retail/adapt-event

Usage

事件类将帮助您在 Adapt Retail 中调度事件。 您可以使用它来跟踪您喜欢的任何事件，但我们为您提供了一些预配置的事件。

Import to project

安装后，只需使用普通节点语法导入包即可。

// EcmaScript6 and up
import AdaptEvent from '@adapt-retail/adapt-event';

Dispatching events

/*
 * @param event
 * @param description (optional)
 * @param position (optional)
 * 
 * @return void
 */
AdaptEvent.dispatch( 'Event name', 'Description' );

如果您调度 MouseEvent，请将事件添加为第三个参数 跟踪点击发生的位置。

var logo = document.querySelector( '.logo' );

logo.addEventListener( 'click', function( event ) {
    AdaptEvent.dispatch( 'click', 'on-logo', event );
} );

Plugins

可以使用插件扩展 AdaptEvent 的功能。 这可能是 f.eks。 扩展事件以匹配其他显示网络，例如 Google Double Click 和 AdForm。

阅读如何构建您自己的文档

AdaptEvent.addPlugin( new Plugin );

Default plugins

我们还包括一些默认插件，让您的生活更轻松。

阅读更多文档

// Import and add plugin
import {
    AdaptEvent,
    AdaptClickEvent,
    AdaptGoogleAnalythics
} from '@adapt-retail/adapt-event';

AdaptEvent.addPlugin( new AdaptClickEvent );
AdaptEvent.addPlugin( new AdaptGoogleAnalythics );


// Track a click 
document.querySelector( '.logo' ).adaptClick( function( event ) {
    ...
}, 'a-click', 'logo' );

// Track click and navigate to url
document.querySelector( '.logo' )
    .adaptClickAndNavigate( 'https://adaptretail.com', 'navigate', 'from-logo' );

Development

# Install dependencies
npm install

# Run test suit
npm run test

# Run test suite on file change
npm run tdd