fix: 修复登录弹窗在移动端视图下异常显示且无法关闭的问题
This commit is contained in:
1 parent
da9aaa43ce
commit
3bb9bdcc3a
2 files changed
+8
-3
No files matched your search
@@ -44,12 +44,15 @@ export function Modal({
|
||||
return () => document.removeEventListener("keydown", onKeyDown);
|
||||
}, [onKeyDown]);
|
||||
|
||||
// 修复:在移动端,只有当 showModal 为 true 时才渲染 Leaflet 组件。
|
||||
// 这可以防止它在所有页面加载时都默认弹出。
|
||||
// 同时,添加 showBlur={true} 属性以显示背景遮罩。
|
||||
if (isMobile) {
|
||||
return (
|
||||
<Leaflet show={showModal} setShow={setShowModal}>
|
||||
return showModal ? (
|
||||
<Leaflet setShow={setShowModal} showBlur={true}>
|
||||
{children}
|
||||
</Leaflet>
|
||||
);
|
||||
) : null;
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
@@ -42,9 +42,11 @@ export default function PasswordModal({
|
||||
return (
|
||||
<Modal showModal={showPasswordModal} setShowModal={setShowPasswordModal}>
|
||||
<div className="w-full overflow-hidden bg-white/95 backdrop-blur-xl shadow-xl p-4 md:max-w-3xl md:rounded-2xl md:border md:border-gray-200">
|
||||
{/* 修复:添加 onPointerDown 事件来阻止拖动事件与点击事件的冲突 */}
|
||||
<Close
|
||||
className="absolute top-4 right-4 h-6 w-6 text-gray-500 hover:text-gray-700 cursor-pointer"
|
||||
onClick={() => setShowPasswordModal(false)}
|
||||
onPointerDown={(e) => e.stopPropagation()}
|
||||
/>
|
||||
|
||||
<div className="flex flex-col items-center justify-center space-y-3 border-b border-gray-200 px-4 py-5 text-center md:px-16">
|
||||
|
||||
Reference in new issue
Block a user