0

I am using Airbnb's style guide and have a couple of functions that reference each other this error is triggered no matter which function is above the other. Is there a best practice on how to fix this error besides just disable it?

function foo() {
    const ham = document.querySelector('#ham');
    ham.onclick = () => {
        bar();
    };
}

function bar() {
    const spam = document.querySelector('#spam');
    spam.onclick = () => {
        foo();
    };
}
Dan Neal
  • 51
  • 6

1 Answers1

0

You might have to just disable for the first function since your use case is also popular:

function foo() {
    const ham = document.querySelector('#ham');
    ham.onclick = () => {
        /* eslint-disable no-use-before-define */
        bar();
    };
}

Or you can wrap them up in an literal object to resolve the issue:

const wrapper = {
  foo() {
    const ham = document.querySelector<HTMLDivElement>('#ham');
    ham.onclick = () => {
        wrapper.bar();
    };
  },

  bar() {
    const spam = document.querySelector<HTMLDivElement>('#spam');
    spam.onclick = () => {
        wrapper.foo();
    };
  }
};
tmhao2005
  • 14,776
  • 2
  • 37
  • 44