isDraggingOver когда isDropDisabled реагирует-красивый-dnd - PullRequest
1 голос
/ 20 января 2020

Тот же вопрос на 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>
    </>
  );
}
...