UseEffect - React Hook useEffect 缺少依赖项：

Posted 2023-02-21

【中文标题】UseEffect - React Hook useEffect 缺少依赖项：

【英文标题】：UseEffect - React Hook useEffect has a missing dependency:

【发布时间】：2021-02-23 21:08:32

【问题描述】：

我在 useeffect 挂钩上收到以下错误。

React Hook useEffect 缺少一个依赖项：'currentPage'。要么包含它，要么移除依赖 array.eslintreact-hooks/exhaustive-deps

关于我为什么会得到这个的任何想法？

const Pagination = () => 
const [ page, setPage ] = useState(1);

let params = new URLSearchParams(window.location.search);
let currentPage = params.get('page') || 1;

useEffect(() => 
    setPage(currentPage)
, []);

return (
    <div>
        <h1>page</h1>
        /* 
        *
        * Skip number, current page, totalCount
        *                
        */
    </div>
);

【问题讨论】：

它应该如何工作？如果它不应该对参数更改做出反应，则应将参数移动到 useEffect，这会删除一个 dep 并防止在每次渲染时计算它们

这是由于名为“react-hooks/exhaustive-deps”的 ESLint 规则。在这里解释：reactjs.org/docs/hooks-rules.html

【参考方案1】：

将 currentPage 添加到依赖数组将删除警告，并且由于除非 url 更改，否则该值不会更改，因此 usseEffect 将仅被调用一次。