Javascript 旋转后如何获得正确的屏幕内宽？

我试图获得屏幕的内部宽度，我设法做到这一点，但当我在移动视图上转到页面时，我首先得到375，在转到横向视图后，我得到667，当返回到纵向视图时，我得到618。为什么我从横向返回时与从另一个页面导航时有所不同？ 我所做的：

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

这就是我得到宽度的方法

    import React, { useState, useEffect } from 'react';

const useWindowWidth = (WrappedComponent) => (props) => {
    const [width, setWidth] = useState(window.innerWidth);
  
    useEffect(() => {
      const handleResize = () => {setWidth(window.innerWidth);}
  
      window.addEventListener('resize', handleResize);
  
      return () => {
        window.removeEventListener('resize', handleResize);
      };
    }, []);
  
    return (    <WrappedComponent {...props} width={width} />
    )
  }

export default useWindowWidth;

import React，{useState，useffect}来自“React”；
常量useWindowWidth=（WrappedComponent）=>（道具）=>{
const[width，setWidth]=useState（window.innerWidth）；
useffect（（）=>{
const handleResize=（）=>{setWidth（window.innerWidth）；}
window.addEventListener（'resize'，handleResize）；
return（）=>{
removeEventListener（'resize'，handleResize）；
};
}, []);
报税表（
)
}
导出默认窗口宽度；

我需要js中的宽度，因为我必须从npm设置react pdf的宽度，并且应该在组件的道具中设置

       let windowWidth = width * 0.9;
   return (
       <Document
        file={url}
        onLoadSuccess={onDocumentLoadSuccess}
        className={classes.pdfFileContainer}
      >
        <Page pageNumber={pageNumber} width={windowWidth} />
      </Document>
);

让windowWidth=width*0.9；
返回(
);

与其调整大小，不如尝试听相同的行为。为什么还要通过JS这样设置宽度？为什么不使用CSS呢？我需要在js中设置宽度，在问题中添加了它。与其调整大小，不如尝试听相同的行为。为什么你甚至像这样通过js设置宽度？为什么不使用CSS呢？我需要在js中设置宽度，在问题中添加了它。