javascript - 旋转后如何获得正确的屏幕内部宽度？

Question

我尝试获取屏幕的 innerWidth 并且我设法做到了，但是当我转到移动视图上的页面时，我首先得到 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;

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

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