最近开发遇到的问题

1、css相关

当想设置一个div盒子，高度随着窗口的变化，而高度也同时变化。用vh

height: calc(100vh - 150px);   

 

2、IOS safari 进行 X 连携时候，safari浏览器当检测到手机已经安装了X app时候，会自动打开 X app，叫做 universal link.

这样原画面在监测window.open是否返回值时候，一直为false，会走进错误信息提示里面。

 let popupHandled = false;

    // callback 関数 只调用一次
    function handlePopupResult(callback: any) {
      if (!popupHandled) {
        popupHandled = true;
        callback();
      }
    }
    let globalFallbackTimeout: any = null;

// 点击按钮 分享到X app
const handleClick = () => {
const tweetUrl = `https://twitter.com/intent/tweet?text=${tweetText}`;
const isIOS = /iP(hone|od|ad)/.test(navigator.userAgent);
const isSafari = isIOS && /Safari/i.test(navigator.userAgent);



            const width = 600;
            const height = 600;
            const left = window.innerWidth / 2 - width / 2;
            const top = window.innerHeight / 2 - height / 2;

            const popup = window.open(
              tweetUrl,
              "PostToX",
              `width=${width},height=${height},left=${left},top=${top}`,
            );

            // visibilitychangeイベントを監視して、ページが切り替わったかどうかを検出する
            // 「X APP」は開いていますなど
            document.addEventListener(
              "visibilitychange",
              () => {
                if (document.hidden) {
                  clearTimeout(globalFallbackTimeout);
                  handlePopupResult(() => handlePopupSuccess());
                } else {
                  if (!popup || popup.closed) {
                    handlePopupResult(() => handlePopupFailure());
                  } else {
                    handlePopupResult(() => handlePopupSuccess());
                  }
                }
              },
              { once: true },
            );

            // ポップアップをブロックの場合
            if (isSafari) {
              globalFallbackTimeout = setTimeout(() => {
                if (!document.hidden && (!popup || popup.closed)) {
                  handlePopupResult(() => handlePopupFailure());
                }
              }, 2000);
            }

            // 成功の場合
            function handlePopupSuccess() {
              setIsLoading(false);
              const today = getTodayDateString();
              localStorage.setItem("isSharedFruits", today);
              if (isSharedToday) {
                setIsShareDonwModalOpen(false);
                setIsSharedModalOpen?.(false);
              } else {
                setIsShareDonwModalOpen(true);
                setIsSharedModalOpen?.(false);
              }
              setIsSharedToday(true);
              setIsPopupBlocked(false);
            }

            // ポップアップをブロックの場合
            function handlePopupFailure() {
              setIsPopupBlocked(true);
              setErrorMessage("ポップアップがブロックされました！");
              setIsLoading(false);
            }

            handleSaveAsImage();
}