The
miis
is a tiny functional event subscriber and dispatcher.
- Tiny: weighs less than 1kb gzipped
- Plentiful: a special "*" event type listens to all events
- Scope: isolate different listening environments by setting scope
This project need node and npm.
npm install miis --save
or
pnpm add miis --save
import miis from "miis";
miis.subscribe("a", (...args) => {
console.log("a event call"); // a event call
console.log(...args); /// 1, 2, 3
});
miis.dispatch("a", 1, 2, 3);
And it's so easy to operate with react. Here is a demo.
import * as React from "react";
import "./style.css";
import miis from "miis";
export default function App() {
const [count, setCount] = React.useState(0);
React.useEffect(() => {
return miis.subscribe("a", () => {
setCount(count + 1);
});
}, [count]);
const handleClick = () => {
miis.dispatch("a");
};
return (
<div>
<button onClick={handleClick}>Dispatch A</button>
<p>Count: {count}</p>
</div>
);
}
You could unsubscribe the event lisenter with the result of subscribe.
import miis from "miis";
const unsubscribe = miis.subscribe("a", () => {
console.log("a event call");
});
unsubscribe();
miis.dispatch("a"); // not work
Register an event listenter for the given name.
eventName
string | symbol Name of event to listen for.(*
for all events)listenter
Function Function to call in response to given eventoptions
undefined | Object Some options. optionalonce
boolean Only call once if it istrue
.
unsubscribe
Function Function to remove the listenter.
Invoke all handlers for the given name.
eventName
string | symbol Name of event to invoke for.
Clears the specified listeners. It will clear all listeners if the parameter is undefined.
eventName
string | symbol | undefiend Name of event to listen for.(undefined for all events)
If you call dispatch
, only the handlers for the given scope will be invoked.
scope
string Name of scope.
Return current scope
.
Reset the scope to be default
.