📚
PWA(safari on iOS)では、resizeイベントが検知できない問題の対処法
safari on iOSではresizeイベントを検知しないので、
PWA(safari on iOS)では、resizeイベントが検知できない。
なので、isPWA()を作成して、PWAの場合はorientationchangeイベントで制御するようにした。
これが全デバイスで有効かは定かではない。
const isPWA = () =>
'share' in navigator ||
window.matchMedia('(display-mode: standalone)').matches
useEffect(() => {
setFillHeight()
if (isPWA()) {
window.addEventListener('orientationchange', setFillHeight)
} else {
window.addEventListener('resize', setFillHeight)
}
return () => {
if (isPWA()) {
window.removeEventListener('orientationchange', setFillHeight)
} else {
window.removeEventListener('resize', setFillHeight)
}
}
}, [])
Discussion