如何观察 node.current.clientHeight 在 React 中发生了变化？答案

【问题标题】：How to observe node.current.clientHeight has changed in React?如何观察 node.current.clientHeight 在 React 中发生了变化？
【发布时间】：2021-10-08 16:15:41
【问题描述】：

我尝试观察 div 高度是否发生了变化：

useEffect(() => {
  const h = node.current.clientHeight;
  setHeight(h);
}, [node.current]);

<div
  style={{
    position: "absolute",
  }}
  ref={node}
>

div的高度变大，useEffect不会被通知的问题。

我尝试在 5 秒内使用 setTimeout，但用户体验真的很糟糕。你有什么建议？

【问题讨论】：

这能回答你的问题吗？ React: How to observe node.current.clientHeight has changed?
（你有28krep，你应该对使用这个网站的基础有了更好的了解。）
@jonrsharpe，你能告诉我我的问题的主要问题是什么吗？语法？
语法很容易通过编辑来修复（例如，是否 -> 是否，床 -> 不好）。在这种情况下，您重新发布而不是编辑和改进现有的。事实上，它甚至不如前一个那么好，这缺少任何上下文（冒着XY problem 的风险）。
如果你没有时间满足How to Ask的要求，期望别人花时间回答是不合理的。而这不是minimal reproducible example。

标签： reactjs use-ref

【解决方案1】：

无需过滤useEffect的事件：

useEffect(() => {
  if (node && node.current && node.current.clientHeight) {
    setHeight(node.current.clientHeight);
  }
});

【讨论】：