Skip to content

adamhaile/surplus-mixin-on

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 

surplus-mixin-on

Declarative custom event binding for Surplus applications

Most of the time, we can attach event handlers to Surplus nodes by using the on...={...} DOM properties:

<button onclick={handleClick}>Click me!</button>

However, this doesn't work in two cases:

  1. If we're trying to attach to a custom event -- my-custom-event -- there are no DOM properties for it.
  2. If we want to attach multiple handlers for the same event -- the DOM properties can only have one handler.

Surplus-mixin-on is a small fn={...} mixin for Surplus applications that addresses both of these.

// custom events
<div fn={on('my-custom-event', handleCustomEvent)}></div>

// multiple handlers
<div fn={on('click', handleClick1)} 
     fn={on('click', handleClick2)}
><div>

Under the hood, surplus-mixin-on uses the addEventListener() method on the nodes rather than the event handler properties.

About

Declarative custom event binding for Surplus applications

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published