Behavior - Documentation

new Behavior(el, name) → {Behavior}

Source:

core/Behaviour.js, line 21

Properties:

Name	Type	Description
`Behaviour.$name`	String	The name given to the behaviour
`Behaviour.$el`	HTMLElement	The element the behaviour is attached to
`Behaviour.$body`	HTMLElement	the body element
`Behaviour.$html`	HTMLElement	the html element
`Behaviour.$data`	Object	any data attributes on the $el
`Behaviour.$$$eventBus.on`	function	global event emitter, listen to events
`Behaviour.$$$eventBus.off`	function	global event emitter, remove to events
`Behaviour.$$$eventBus.emit`	function	global event emitter, emit event
`Behavior.KEY_CODES`	Object
`Behaviour.KEY_CODS.DELETE_KEY`	Number	delete
`Behaviour.KEY_CODS.SHIFT_KEY`	Number	shift
`Behaviour.KEY_CODS.CTRL_KEY`	Number	control
`Behaviour.KEY_CODS.ALT_KEY`	Number	alt
`Behaviour.KEY_CODS.RETURN_KEY`	Number	return
`Behaviour.KEY_CODS.ESC_KEY`	Number	escape
`Behaviour.KEY_CODS.SPACE_KEY`	Number	space
`Behaviour.KEY_CODS.LEFT_KEY`	Number	left
`Behaviour.KEY_CODS.UP_KEY`	Number	up
`Behaviour.KEY_CODS.RIGHT_KEY`	Number	right
`Behaviour.KEY_CODS.DOWN_KEY`	Number	down
`Behaviour.KEY_CODS.CMD_KEY`	Number	command

Behavior class to handle adding/removing functionality from the dom. Use the mixins to add enhancements

Example

import Behaviour from '@/core/Behaviour'

export default class ExampleWithAllTheThings Behaviour {
	mount = () => {
		// this.$el === the node with the data-behaviour
		this.$el.classList.add('mount')
		// this.$body === <body></body>
		// this.$html === <html></html>
		// this.KEY_CODES === common key codes
		// this.$data === any data attributes on this.$el
	}

	unmount = () => {}
}