Reactjs 反应-侦听div宽度的更改

我试图设置一个侦听器来确定应用程序中特定div的宽度。如果div的宽度小于800px，我想将样式设置为display:none。我可以按原样做，但它不会听，只有在我刷新页面时才会删除div

const [style, setStyle] = useState({});
const documentRef = useRef(null);

useEffect(() => {
  if (documentRef.current.offsetWidth < 800) {
    const updatedStyle = {
      display: 'none',
    }
    setStyle(updatedStyle);
  }
}, [documentRef.current]);

const[style，setStyle]=useState（{}）；
const documentRef=useRef（null）；
useffect（（）=>{
如果（文件参考当前偏移网络宽度<800）{
常量updatedStyle={
显示：“无”，
}
设置样式（更新样式）；
}
}，[documentRef.current]）；

当低于800像素时，可以使用CSS媒体查询隐藏某些内容

@media only screen and (max-width: 800px) {
  show-lg-only {
    display: none;
  }
}

---

当一个特定的div小于800px，而不是整个屏幕时，我会尝试这样做。您可以将相同的类添加到特定的divRight，但当

屏幕

小于800px宽度时，会出现这种情况，而不是div。不确定，但可能会有所帮助。