/** * 屏幕方向管理工具类 * 用于检测和处理屏幕方向变化 */ export default { /** * 监听屏幕方向变化 * @param {Function} callback 方向变化时的回调函数 * @returns {Object} 包含remove方法的对象,用于移除监听 */ onOrientationChange(callback) { // 监听window的orientationchange事件 const handleOrientationChange = () => { const orientation = window.orientation || 0; const isLandscape = Math.abs(orientation) === 90; const isPortrait = orientation === 0 || orientation === 180; callback({ orientation, isLandscape, isPortrait }); }; window.addEventListener('orientationchange', handleOrientationChange); // 立即执行一次回调,获取当前方向 handleOrientationChange(); // 返回移除监听的方法 return { remove: () => { window.removeEventListener('orientationchange', handleOrientationChange); } }; }, /** * 获取当前屏幕方向 * @returns {Object} 包含orientation、isLandscape、isPortrait属性的对象 */ getCurrentOrientation() { const orientation = window.orientation || 0; return { orientation, isLandscape: Math.abs(orientation) === 90, isPortrait: orientation === 0 || orientation === 180 }; }, /** * 请求全屏显示 * 对于视频播放等场景很有用 * @param {HTMLElement} element 要全屏显示的元素,默认为document.documentElement */ requestFullscreen(element = document.documentElement) { if (element.requestFullscreen) { element.requestFullscreen(); } else if (element.mozRequestFullScreen) { element.mozRequestFullScreen(); } else if (element.webkitRequestFullscreen) { element.webkitRequestFullscreen(); } else if (element.msRequestFullscreen) { element.msRequestFullscreen(); } }, /** * 退出全屏 */ exitFullscreen() { if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitExitFullscreen) { document.webkitExitFullscreen(); } else if (document.msExitFullscreen) { document.msExitFullscreen(); } } };