Я работаю над проектом, в котором мне нужно реализовать функцию перетаскивания с использованием пакета React-dnd. Чего я могу достичь. Но проблема в том, что целевой компонент (где будут удалены перетаскиваемые элементы) содержит событие мышь, которое запускается во всех сценариях, за исключением случаев, когда я удаляю в нем какой-либо компонент. Он должен срабатывать даже в случае падения, но не срабатывает. Я также пробовал запустить вручную, и он сработал, но значения, такие как смещения, не соответствуют ожидаемым.
У меня есть тестовая среда с примером кода, в которой Dustbin.tsx содержит это событие mouseup, которое не запускается, когда в него помещается какой-либо перетаскиваемый компонент. Спасибо.
Ссылка на песочницу: https://codesandbox.io/s/dawn-snowflake-ej08d0?file=/src/Dustbin.tsx
Зачем использовать onmouseup
?
The onmouseup event occurs when a user releases a mouse button over an element.
Если вы хотите определить, упало ли что-то внутри этого контейнера, используйте ondrop
Execute a JavaScript when a draggable element is dropped in a element:
return (
<div
ref = {drop}
style = {{ ...style, backgroundColor }}
onDrop = {() => console.info("dropped")}
>
{isActive ? "Release to drop" : "Drag a box here"}
</div>
);