Невозможно передать параметр в функцию через addEventListener

Question

У меня есть следующая функция:

export function myoutsideClickHandler(menuRef) {
    console.log("%%%%%%%%%%%%%%%%%%%%%%%%%%");
    console.log(menuRef);
    document.addEventListener('click', (menuRef)=>test1(menuRef), false);
}

Я вижу, что menuRef напечатан и имеет значение.Пока все хорошо.

Теперь в функции test1() у меня есть:

export function test1(e, menuRef){
    console.log(menuRef);
}

В консоли я вижу undefined, что означает, что menuRef не был отправлен через addEventListener

Я не прав, когда передаю параметр menuRef?

Answer 1

То, как вы связываете событие, неверно. menuRef в вашем клике будет событие. Вы не передаете второй аргумент. Ваш обработчик кликов должен быть:

document.addEventListener('click', evt => test1(evt, menuRef), false);

Answer 2

Вы можете использовать анонимную функцию для вызова функции обратного вызова, которая требует нескольких параметров.Так что в вашем случае изменение вашей функции myoutsideClickHandler() на следующее должно работать:

export function myoutsideClickHandler(menuRef) {
    console.log("%%%%%%%%%%%%%%%%%%%%%%%%%%");
    console.log(menuRef);
    document.addEventListener('click', function(e) {
        test1(e, menuRef);
    }, false);
}

Однако я должен отметить, что вы не используете обработчики событий правильно, их следует вызывать и устанавливать внещелкните функции-обработчики, так что вы можете прочитать об этом, чтобы избежать будущих проблем.