prevent element's dragover

This commit is contained in:
Sczlog 2022-01-04 17:47:02 +08:00
parent 52402be5aa
commit 83c9a5717d

View File

@ -1,4 +1,4 @@
import React, { useEffect, useMemo } from 'react';
import React, { useMemo } from 'react';
import { css } from '@emotion/css';
import { ComponentWrapperType } from '@sunmao-ui/runtime';
import { observer } from 'mobx-react-lite';
@ -28,16 +28,6 @@ export const ComponentWrapper: ComponentWrapperType = observer(props => {
return [slots, slots.length > 0];
}, [component.type]);
useEffect(() => {
if (isDroppable) {
const listener = (e: Event) => e.preventDefault();
document.addEventListener('dragover', listener);
return () => {
document.removeEventListener('dragover', listener);
};
}
}, [isDroppable]);
const borderColor = useMemo(() => {
if (dragOverComponentId === component.id) {
return 'orange';
@ -109,6 +99,9 @@ export const ComponentWrapper: ComponentWrapperType = observer(props => {
onClick={onClickWrapper}
onMouseEnter={onMouseEnterWrapper}
onMouseLeave={onMouseLeaveWrapper}
onDragOver={e => {
if (isDroppable) e.preventDefault();
}}
className={style}
>
{props.children}