I put a listener to process in a noname function (because I have to transmit some data further - 'evt' and 'ref' for example). How to close a listener in another remote file, were I process this data.
index.js:
import onClick from "./onClick.js";
const ref = document.querySelector('h1');
ref.addEventListener('click', (evt) => {onClick(evt, ref)}
onClick.js:
export default function onClick(evt, ref) {
console.log(evt);
ref.removeEventListener('click', onClick)
};
You can just assign the anonymous function to a variable to have a function name, and pass it to onClick function. It seems to be anti-pattern (passing callee function to caller), but I guess this is what you're looking for:
index.js
import onClick from "./onClick.js";
const ref = document.querySelector('h1');
function clickCb(evt) {
onClick(evt, ref, clickCb)
}
ref.addEventListener('click', clickCb}
onClick.js
export default function onClick(evt, ref, clickCb) {
console.log(evt);
ref.removeEventListener('click', clickCb)
};