无法从 noname 远程回调函数中删除 eventlistener [重复]答案

【问题标题】：Cannot remove eventlistener from noname remote callback function [duplicate]无法从 noname 远程回调函数中删除 eventlistener [重复]
【发布时间】：2022-02-08 02:04:57
【问题描述】：

我在一个 noname 函数中放置了一个监听器来处理（因为我必须进一步传输一些数据 - 例如“evt”和“ref”）。如果我处理了这些数据，如何关闭另一个远程文件中的侦听器。

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)
};

【问题讨论】：

onClick() 不正确是什么意思？你想达到什么目标？
抱歉解释不好。我在 noname 函数上放置了一个监听器（因为我必须进一步传输一些数据 - 例如'ref'）。如果我处理了这些数据，如何关闭另一个远程文件中的侦听器。
那么就给它起个名字吧？

标签： javascript callback event-listener

【解决方案1】：

您可以将匿名函数分配给具有函数名称的变量，然后将其传递给 onClick 函数。它似乎是反模式（将被调用函数传递给调用者），但我想这就是你要找的：

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)
};

【讨论】：

是的，但是我们需要从 index.js 导出 ClickCb 并导入到 onClick.js - 它可以工作，但是代码变得如此混乱。
为什么需要导出导入clickCb？像任何其他函数一样作为参数传递。应该不需要导出或导入它
非常感谢，我会试试这个！