# tool-event

> 工具页面事件通信

Latest version **1.0.6** (published 2021-02-04) · ISC license · 0 weekly downloads

## Install

```sh
npm install tool-event
pnpm add tool-event
yarn add tool-event
bun add tool-event
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.6 |
| Published | 2021-02-04 |
| First published | 2021-01-04 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Unpacked size | 24.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | yangzhuoheng |

## Links

- npm: https://www.npmjs.com/package/tool-event
- npm.io page: https://npm.io/package/tool-event

## Dependencies (5)

- [babel-loader](https://npm.io/package/babel-loader.md) ^7.1.5
- [babel-runtime](https://npm.io/package/babel-runtime.md) ^6.26.0
- [babel-polyfill](https://npm.io/package/babel-polyfill.md) ^6.26.0
- [babel-preset-env](https://npm.io/package/babel-preset-env.md) ^1.7.0
- [babel-plugin-transform-runtime](https://npm.io/package/babel-plugin-transform-runtime.md) ^6.23.0

## Recent versions

- 1.0.6 (latest) — 2021-02-04
- 1.0.5 — 2021-01-30
- 1.0.4 — 2021-01-29
- 1.0.3 — 2021-01-04
- 1.0.2 — 2021-01-04
- 1.0.1 — 2021-01-04
- 1.0.0 — 2021-01-04

## README

## 安装
```bash
 npm install tool-event
```

## 原理
        ParentToolWindow
        ↑              ↑
        ↓              ↓
    Tool1Window    Tool2Window

    解释:
    0. 定义
        ParentToolWindow:父工具窗口
        Tool1Window:工具1窗口，以iframe方式运行在父窗口里面的工具1的窗口
        Tool2Window:工具2窗口，以iframe方式运行在父窗口里面的工具2的窗口

    1. 初始化
        工具1页面在加载时，向父工具中注册本工具窗口的引用
    2. 注册监听事件
        工具1向父工具窗口注册监听的工具事件，监听参数由工具2别名（表示监听工具2的事件）、事件名称和回调参数组成。
    3. 发出事件
        工具2向父工具窗口发布事件，发布参数由工具1别名（表示接收事件的目标工具）、事件名称和传递的数据
    4. 转发事件
        父窗口收到工具2发布的事件后，寻找接收事件的目标工具:
            如果没有找到:
                则忽略;
            找到，如果发布的目标工具为工具1:
                判断工具1在监听事件名 == 发布参数的事件名？
                    如果在监听:
                        父窗口找到工具1的窗口引用，然后发布事件;
                    如果没有监听:
                        忽略该事件;
    5. 接收和处理事件
        工具1收到父窗口发布的事件后，执行回调函数。     
    6. 广播与接收广播
        当发布消息时，如果工具别名=*，表示事件发布给所有注册在父窗口的工具。
        当接收消息时，如果工具别名=*，表示接收所有工具发布的某类事件。
    7. 约束
        工具别名和事件名称不能为空。 但是工具别名可以指定为所有。                

## 使用

### 初始化
```javascript
//导入tool-event模块
import E from 'tool-event';
 //参数是当前工具的别名
 const ToolEvent = new E("SelectPeopleTool");
```

### 发起事件例子(emit)
```javascript
var data = {
    "name":张三,
    "age":18
}
//第一个参数是工具别名，第二个参数是事件的名称，第三个参数是数据内容
ToolEvent.emit("toolAlias","eventName",data)
```

### 添加监听事件例子(on)
```javascript
//第一个参数是工具别名，表示监听哪个工具的事件，第二个参数是事件的名称，第三个参数是数据回调函数
ToolEvent.on("toolAlias","eventName",(data) =>{
    console.log(data);
}) 
```

### 移除监听事件例子(off)
```javascript
//第一个参数是工具别名，第二个参数是事件的名称
ToolEvent.off("toolAlias","eventName") 
```

---
_Source: https://npm.io/package/tool-event · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._