时间戳

首页 > 解决方案 > useEffect as Callback for useState 依赖太多

javascript - useEffect as Callback for useState 依赖太多

问题描述

我正在用 React Hooks 重写一个类组件（因为它更干净），但我面临一个问题。在我的类组件中，我有一个回调函数this.setState({B: "blah blah blah"}, () => {//do some function with state A})，因此每次状态 x 发生变化时，我都会将新的状态值与状态 B 结合使用。当我尝试使用 React Hooks 实现相同的功能时，如下所示：

useEffect(() => {
    // Use state A with state B in function
   myFunction();
}, [myFunction])

const myFunction = useCallback(() => {console.log(`${A} and ${B}`}, [A, B]);

我只希望我的函数在状态 A 更改时运行 - 而不是状态 B ......但是现在它会在状态 A 或状态 B 呈现的任何时候重新呈现。

我尝试在 useCallback [A] 中只包含一个依赖项——A——但问题是我得到：React Hook useCallback 缺少依赖项：'B'。包括它或删除依赖数组

标签： javascriptreactjsreact-hooks

解决方案

也许尝试使用

}, [A])

作为唯一的依赖项，并在函数的末尾使用这样的注释：

// eslint-disable-next-line

这将禁用缺少的依赖项并为您提供所需的结果。这通常对我有用。

推荐阅读