How to fix 'eslint(no-unused-vars)' error in React

Question

As I have already installed babel-eslint,eslint-plugin-react and eslint-plugin-es in my project and config them in .eslintrc, it seems like most of the strange problems eslint output before has been gone.But here is still one problem which makes me very confused. Here is a function in one of my React component:

mouseMove = (e) => {
    window.onmousemove = (e) => {
        // ...
    };
}

'e' is declared but never used(no-unuesd-vars)

If you don't use the variable `e`, just don't declare it and replace `(e)` with `()` — Zenoo, Aug 19 '19 at 08:47
You could also add an eslint ignore statement. https://stackoverflow.com/questions/27732209/turning-off-eslint-rule-for-a-specific-line — A. van Hugten, Aug 19 '19 at 08:48

score 2 · Answer 1 · answered Aug 19 '19 at 08:50

2

If you dont use e variable, you should remove it:

mouseMove = () => {
   window.onmousemove = () => {
    // ...
   };
}

answered Aug 19 '19 at 08:50

Ryan Nghiem

2,417
2
18
28

score 1 · Answer 2 · answered Aug 19 '19 at 08:52

The above e has been shadowed by declaring a function in mouseMove scope using an argument named e again. There's no way to access the outer e inside onmouseover so eslint will complain.

You can fix this by removing the argument e of mouseMove or rename it.

Hope this can help.

How to fix 'eslint(no-unused-vars)' error in React

2 Answers2