如何在 iOS Safari 中获取当前屏幕方向？

Question

我正在尝试获取 iOS 的当前屏幕方向，但是我的功能可以在 chrome 开发工具模拟器和桌面上运行，但在 iOS 上不起作用。

这是我的功能：

export type ScreenOrientation = "landscape" | "portrait";

export function getScreenOrientation(): ScreenOrientation
{
  if (window.screen.availHeight > window.screen.availWidth)
    return "portrait";
  else
    return "landscape";
}

这是我的程序大致如何检测屏幕方向变化并使用该功能：

  import { getScreenOrientation } from "../../Utils/getOrientation";
  const shoWPortraitModeError = getScreenOrientation() == "landscape" ? false : true;
  window.onorientationchange = function () {
    const newState = getScreenOrientation() == "landscape" ? false : true;
    console.log("window.onorientationchange: ", newState)
    shoWPortraitModeError  = newState;
  };

我尝试使用window.screen.height但window.screen.width没有成功。这是函数：

export type ScreenOrientation = "landscape" | "portrait";

export function getScreenOrientation(): ScreenOrientation
{
  if (window.screen.availHeight > window.screen.availWidth)
    return "portrait";
  else
    return "landscape";
}

我在 mac 虚拟机上启动 iOS safari 调试器，我注意到当window.screen我转动屏幕时该值没有改变：

这让我想知道我可以使用哪些不同的属性来检测 ios 上的屏幕方向？

Answer 1

在深入研究 safari 调试器的开发控制台的 intelisense 后，我发现您可以使用window.innerHeight和window.innerWidth属性来检测屏幕方向。

以下是如何使用该功能：

export type ScreenOrientation = "landscape" | "portrait";

export function getScreenOrientation(): ScreenOrientation
{
  if (window.innerHeight > window.innerWidth)
    return "portrait";
  else
    return "landscape";
}