8

所以我遇到了 React 的一个问题，如果我尝试使用“历史”，我的代码将不会运行，告诉我这是“意外使用history无限制全局”。

我求助于 StackOverflow 以获得帮助，令人惊讶的是，我能够找到我正在处理的问题的答案。

另一个用途建议的修复效果很好，但现在我很困惑为什么它首先会起作用。

使用 redux，我通过 mapDispatchToProps 调用了一个方法。我需要将“历史”作为传入的变量之一放入，以便我可以将用户重定向回他们所在的上一页。

最初，我尝试仅将“历史”本身用作变量，但是当我尝试编译时会出现“无限制全局”错误，因此我转向 StackOverflow。这是他们建议我尝试使用“window.history”的时候。起初我持怀疑态度，因为我不认为这么简单的东西可以解决我的问题，但是你瞧，它编译成功了。

props.addExperience(data, history);

对比

props.addExperience(data, window.history);

window.history 有效。有人可以解释为什么 window.history 有效但 history 本身不起作用吗？

“历史”究竟是什么？'window' 做了什么来解决这个问题？

编辑：这是我找到的原始 StackOverflow 帖子。虽然 Chasen Bettinger 能够解决这个问题，但他从未真正解释过窗口的原因。会解决这个问题。如果这里有人能做到这一点，那就太棒了。

4

1 回答 1

6

您遇到的 linting 规则试图解决的问题是隐式引用全局对象上的属性是错误的一个简单来源。例如：

var status = false;
if (status) {
  console.log('status is actually truthy!');
}

在这里，status顶层实际上是指window.status，它必须始终是一个字符串；分配false给它会导致false变成'false'.

如果status是具有该规则的受限全局，则只有在status显式引用window.status. 这样，很明显您是在故意引用全局属性，这不是偶然的。

当您引用window.history而不是history. 例如，如果在前面的代码中定义了一个变量怎么办？

var history;

然后用

props.addExperience(data, history);

linter 不能确定您是否尝试引用全局对象上的属性，或者您是否打错了字。因此，该规则可以让您明确指定该属性位于window（或更正变量名称）上。

至于window.history实际上是什么，请参阅 MDN：

Window.history只读属性返回对 History 对象的引用，该对象提供了一个用于操作浏览器会话历史记录的接口（在加载当前页面的选项卡或框架中访问的页面）。

例如

history.back();     // equivalent to clicking back button
history.go(-1);     // equivalent to history.back();
window.history.go(0); // refresh the current page
history.pushState(stateObj, "page 2", "bar.html"); // add an item to the history state
于 2019-06-22T20:30:42.153 回答