npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

events-trigger

v1.2.5

Published

custom events trigger

Downloads

4

Readme

Events Trigger

一个简单的自定义事件触发器。源码使用最流行的ES6语法编写,类似于jQuery的事件api(on, off, trigger),可单独使用或者被其他构造器对象继承使用。

快速上手

  1. 使用npm安装到你的项目中:npm install --save events-trigger
  2. 使用commonjs或者es6模块方式导入:
var EventsTrigger = require('events-trigger');
//
// 或者
import EventsTrigger from 'events-trigger';
  1. 绑定一个自定义事件:
let events = new EventsTrigger();
events.on('my-event', () => console.log('trigger my-event'));
  1. 触发你的自定义事件:
events.trigger('my-event');

方法

  • on(type, callback):绑定自定义事件

    type: (String)

    事件类型,可以是type,或者type.namespace,例如:myevent.mudule01

    callback(data1 [, data2, ...]): (Function)

    事件回调方法,参数可以传入单个或多个,例如:handler(1, 2, 3)

  • off([event]):删除自定义事件

    type: (String)

    事件类型,可选。type或者.namespace,或者type.namespace。只传入type, 删除所有类型为type的事件。 传入.namespace,删除所有命名空间为namespace的事件,不限制事件类型。传入type.namespace,只删除namespace下类型为type的事件。 如果不传入任何参数,会移除所有事件。

  • trigger(type, [data1 [, data2, ...]]):触发自定义事件

    type: (String)

    事件类型,可以是type,或者type.namespace

    data: (Any Type)

    触发on所绑定的事件的回调方法时,传入的参数,可以是单个或者多个

示例

基本用法

import Events from 'events-trigger';
let events = new Events();
events.on('touch', (message) => console.log(message));
events.trigger('touch', 'trigger touch');

使用事件命名空间

import Events from 'events-trigger';
let events = new Events();
events.on('touch.e1', (message) => console.log(message));
events.on('touch.e2', (message) => console.log(message));
events.trigger('touch.e1', 'trigger touch on e1');

被其他构造函数继承

import Events from 'events-trigger';

class SomeModule extends Events {
    constructor() {
        super();
        
        this.create();
    }
    
    create() {
        this.trigger('create');
    }
}

let someModule = new SomeModule();

someMudule.on('create', () => console.log('create!'));