如何处理针对dom事件中调用的函数的使用过的无用内容的抱怨

Question

从诸如鼠标单击按钮或链接的事件中调用函数时，eslint会抱怨unused-vars，因为唯一的引用就是HTML页面中的附加事件。

否则，我喜欢unused-vgars警告。

我当前的方法是禁用带有eslint-disable行注释的行，即

const addStreetAddressLine = () => { // eslint-disable-line no-unused-vars

但是现在我在整个代码中都添加了大注释-到目前为止有3个功能。

还有另一种更干净的方法吗？

Answer 1

最好使用Javascript附加侦听器。内联处理程序具有way too many problems：它们具有疯狂的作用域规则，需要全局污染才能起作用，并且在需要使用字符串参数调用该函数时可能需要丑陋的转义。

改为使用addEventListener。例如，更改

<span onclick="addStreetAddressLine()">

到

<span class="someSpan">

document.querySelector('.someSpan').addEventListener('click', addStreetAddressLine);

这将消除棉绒警告 ，并使您的代码更具可维护性。

someSpan在那里，为您提供了选择元素的方法。您不必添加类，只需使用 some 方法即可精确选择元素。