没有受限的全局变量

Question

我正在使用 React 和 Redux 开发一个网络应用程序，当我开始我的项目时，我得到了这个：

Line 13:  Unexpected use of 'location'  no-restricted-globals

Search for the keywords to learn more about each error.

我搜索了很多关于如何解决它的问题，但是 none 我找到的答案对我有帮助，所以我求助于 Stack overflow。

有谁知道如何解决这个错误？我感谢我能得到的所有帮助。

Answer 1

尝试在 location 之前添加 window（即 window.location）。

Answer 2

这是一个简单的解决方案，也许不是最好的解决方案，但它确实有效。

在出现错误的行上方的行中，粘贴以下内容：

// eslint-disable-next-line no-restricted-globals

Answer 3

/* eslint no-restricted-globals:0 */

是另一种替代方法

Answer 4

也许您可以尝试将位置作为道具传递到组件中。下面我使用 ...otherProps。这是传播运算符，它是有效的，但如果您显式传递 props 则不必要，它只是作为演示目的的占位符。此外，研究解构以了解 ({ location }) 的来源。

import React from 'react';
import withRouter from 'react-router-dom';

const MyComponent = ({ location, ...otherProps }) => (whatever you want to render)


export withRouter(MyComponent);

Answer 5

使用 react-router-dom 库。

如果您使用的是函数式组件，则从那里导入 useLocation 钩子：

import { useLocation } from 'react-router-dom';

然后将其附加到一个变量：

Const location = useLocation();

之后就可以正常使用了：

location.pathname

P.S：返回的location对象只有五个属性：

{ hash: "", key: "", pathname: "/" search: "", state: undefined__, }

Answer 6

像这样解构位置：({location})。

没有受限的全局变量

No restricted globals

javascript

reactjs

eslint

react-router