为什么我会收到“意外使用‘location’ no-restricted-globals”？

Question

在我的 reactjs 代码中，我得到了：

 const {
  children,
  location: { pathname },
} = this.props;

let path = location.pathname;

还在这个组件中使用反应路由器模块。如何修复此错误？

原文由 bier hier 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

你应该试试这段代码

const {
  children,
  location: { pathname },
} = this.props;

let path = pathname;

你的 location 变量没有在这个块代码中定义所以 eslint 认为你使用全局变量

原文由 Quoc-Anh Nguyen 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

在大多数/所有网络浏览器中， location.reload() 例如，是其完全限定名称 window.location.reload() 的别名。

您可以通过打开开发工具窗格控制台并输入以下内容在浏览器中对其进行测试：

 location.reload()

和

window.location.reload()

两者都会触发页面刷新。

ES Lint 警告实际上是在警告您您的代码依赖于此别名，因此将来代码可能会突然中断是合理的，如果别名已被弃用或您的工具链的某些部分以某种方式运行需要使用 window.

在 JavaScript 中，由于 variable-shadowing 和 closure 会发生奇怪的事情。可能会在之后声明 location 引用，然后对诸如 location.reload() 之类的引用将中断并显示诸如“没有此类方法重新加载”之类的消息。如果您调用完全限定名称 window.location.reload() 则不太可能发生这种情况。

原文由 agm1984 发布，翻译遵循 CC BY-SA 4.0 许可协议