The element the event is attached to.
The event to capture.
An expression created from the attributes value.
A callback that intercepts the event and delegatesit to the component.
A reference to the local scope of the Componentthat the event was attached to.
This static property lets you define listeners that will be executed whenproperties of the behavior change.
It should be a map where the keys are paths that should be watched on the behavior instanceand the values are names of methods that will be invoked on it when the valueat a path changes.
The following example shows a behavior that reacts to a change in the height ofthe defining element.
export default class MyBehavior extends Behavior { static inject: {element: Element}; static bindings = { 'element.clientHeight': 'heightChange' }; width: number; heightChange(height: number) { this.width = height * 2; }}
This static property defines the name of an instance method thatwill be executed when the bahavior's value changes. Thatsimply means that the result of the expression that was createdfrom the value of the attribute used to define the behavior ina template has changed.
This will always create a one way binding.
The following bahavior will execute its update method everytime the result of the expression given as an attribute valuechanges.
export default class MyBehavior extends Behavior { static update = 'update'; update() {}}
The EventBehavior can be used to attach user events to aDOM element. It is part of Mahalo's special template syntax.
To make use of them you can prefix the event you want to attachwith a @ symbol and use it as the attribute name.
Whenever the event is triggered Mahalo will evaluate the valueof the attribute in the local scope. Temporarily the specialkey $event is available in the local scope.
Example
A simple example that attaches a click event to a button.
<button @click="addUser($event)">Add user</button>
{ default } from mahalo/behaviors/event-behavior