在 useEffect 挂钩中使用对象属性而不是对象作为依赖项是不好的做法吗？

Question

我在我的功能组件中使用以下代码。我希望该组件仅在更改时重新渲染game._id。但 React 不断向我发出警告：

React Hook useEffect 缺少依赖项：“游戏”。包含它或删除依赖项数组

这是一种危险的做法，还是如果我明确希望它依赖于给定的属性，这是合理的？

  const [game, setGame] = useState({});

  useEffect(() => {
    return () => {
      if (game._id !== undefined) {
       // Do stuff with game
      }
    };
  }, [socket, user, game._id]);

我不想使用游戏作为依赖项，因为这会使我的组件重新渲染太多。

Answer 1

依赖项数组检查自上次渲染以来值是否发生更改。它不关心值从哪里来，或者它的形状是什么。game问题出在 linter 上，它看到了inside的使用useEffect，尽管它没有注册为依赖项。声明gameId并为其分配 的值game._id，并将其用作依赖项，并在 内useEffect：

const [game, setGame] = useState({});

const gameId = game._id;

useEffect(() => {
  return () => {
    // use gameId inside useEffect
    if (gameId !== undefined) {
      // Do stuff with game
    }
  };
}, [socket, user, gameId]); // set gameId as dependency