Тот же вопрос на Github - https://github.com/atlassian/react-beautiful-dnd/issues/1712
Вопрос:
Возможно ли справиться isDraggingOver
когда isDropDisabled
верно? Я хочу выделить список красной рамкой, когда он закрыт.
Codesandbox - https://codesandbox.io/s/loving-bush-kz3b1
Код: Например, у нас есть два списка
import cn from "classnames"
const Lists = () => {
const [isCollapsed, setIsCollapsed] = useState([false, false]);
return (
<>
<Droppable droppableId="droppable-1" isDropDisabled={isCollapsed[0]}>
{(provided, snapshot) => (
<section className={cn({
"dragging-over": snapshot.isDraggingOver,
"dragging-over-collapsed": snapshot.isDraggingOver && isCollapsed[0]
})}>{/*...items...*/}</section>
)}
</Droppable>
<Droppable droppableId="droppable-2" isDropDisabled={isCollapsed[1]}>
{(provided, snapshot) => (
<section className={cn({
"dragging-over": snapshot.isDraggingOver,
"dragging-over-collapsed": snapshot.isDraggingOver && isCollapsed[0]
})}>{/*...items...*/}</section>
)}
</Droppable>
</>
);
}