javascript - 函数已定义但从未使用

标签 javascript html eslint

我在重新加载页面时遇到问题。我尝试通过添加此代码在 Vue 中使用 JavaScript

<body onload="myFunction()">

function myFunction() {
   window.location.reload()
}

弹出此错误:

 74:10  error  'myFunction' is defined but never used  no-unused-vars

有什么建议吗?

最佳答案

no-unused-vars 是一个 ESLint 警告。发生这种情况是因为您没有在 javascript 代码中的任何位置调用函数,并且 ESLint 无法读取它是从 HTML 属性调用的。

您可以像这样关闭此警告:

<script>
/* eslint-disable no-unused-vars */
function myFunction() {
  window.location.reload()
}
/* eslint-enable no-unused-vars */
</script>

尽管从 HTML 属性调用 javascript 函数在今天并不是一个好的做法。

有一种 JavaScript 方法可以等待加载事件,而不是使用 onload 属性:

<script>
function myFunction() {
  window.location.reload()
}

document.addEventListener('DOMContentLoaded', myFunction);
</script>

关于页面上的评论仅重新加载一次。您可以在 localStorage 中保留页面已重新加载的事实:

<script>
function myFunction() {
  // Check that the page has not been reloaded
  if (localStorage.getItem('reloaded') === null) {
    // Save the fact that we are reloading the page, and reload page
    localStorage.setItem('reloaded', true);
    window.location.reload();
  } else {
    // Otherwise, reset the flag so that on the fresh load the page can be reloaded again
    localStorage.removeItem('reloaded');
  }
}

document.addEventListener('DOMContentLoaded', myFunction);
</script>

关于javascript - 函数已定义但从未使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65713479/

相关文章:

javascript - 从 javascript 访问 json 元素

javascript - ESLint 错误 : Unexpected assignment within a 'while' statement

html - Flexbox 调整内容即

javascript - 使用 Gulp 与基于 Airbnb 的 ESLint

javascript - Mutation Observer 无法在受支持的 Microsoft Edge 版本上运行

jquery - 如何将样式应用于动态添加的 div?

html - z-index 在两个菜单之间不起作用

reactjs - 尽管来自 ESLint(react-hooks/exhaustive-deps) 发出警告,但依赖数组中的 React.useEffect : Component re-renders with window. location.pathname

javascript - 如果在循环内部使用,则强制将 getter 结果存储在变量中

javascript - 如何计算 VU 表刻度的对数标签?