register-event-listeners
Version:
Utility function to register multiple event listeners
128 lines (81 loc) âĸ 4.33 kB
Markdown
[](https://www.npmjs.com/package/register-event-listeners)
[](https://www.npmjs.com/package/register-event-listeners)
[](https://circleci.com/gh/1natsu172/register-event-listeners)
**Utility function to register multiple event listeners**
_**In other words, utility function that multiple execute addEventListener/removeEventListener**_
---
with **yarn**
```bash
yarn add register-event-listeners
```
or
with **npm**
```bash
npm install register-event-listeners
```
```javascript
import { registerEventListeners } from 'register-event-listeners'
const eventTarget = document.body
const onTouchStart = (event) => console.log(`${event.type} event dispatched.`)
const onTouchMove = (event) => console.log(`${event.type} event dispatched.`)
const onEnd = (event) => console.log(`${event.type} event dispatched.`)
const { register, unRegister } = registerEventListeners(eventTarget, [
['touchstart', onTouchStart],
['touchmove', onTouchMove, { passive: false }],
['touchend', onEnd],
['touchcancel', onEnd]
])
// Execute element.addEventListener(s) passed to the argument.
register()
// Now added event listeners. đ
// Execute element.removeEventListener(s) passed to the argument.
unRegister()
// Now removed event listeners. đ
```
| name | require | type | default | decstiption |
| ----------- | :-----: | :-------------------------------------------------------------------------------------------------------: | :-----: | ------------------------------------------------------------------------------------------------------- |
| eventTarget | â | EventTarget | - | [MDN - EventTarget](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget) |
| listeners | â | Array([EventListeners](https://1natsu172.github.io/register-event-listeners/globals.html#eventlisteners)) | - | [MDN - addEventListener](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) |
**Element is same as the format of the argument of [`addEventListener`](https://developer.mozilla.org/ja/docs/Web/API/EventTarget/addEventListener)**
That is this đ `[type, listener[, options])]`
* `type` is **[event.type](https://developer.mozilla.org/ja/docs/Web/API/Event/type).**
* `listener` is commonly called a **handler**
* `options` is listenerOptions
```javascript
[
['touchstart', onTouchStart, {capture: true, once: true}],
['touchmove', onTouchMove, { passive: false }],
['touchend', onEnd],
['touchcancel', onEnd]
]
```
register event listeners. In other words _addEventListener**s**_.
unRegister event listeners. In other words _removeEventListener**s**_.
with [Jest](https://jestjs.io/).
```bash
yarn test
```
or
```bash
npm run test
```
<!--
Please read [CONTRIBUTING.md](https://gist.github.com/PurpleBooth/b24679402957c63ec426) for details on our code of conduct, and the process for submitting pull requests to us. -->
Use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/1natsu172/handy-media-query/tags).
MIT Š [1natsu172](https://github.com/1natsu172)