使用react-Beautiful-dnd，如何在拖动开始之前更改可拖动的尺寸（onBeforeCapture）

Question

这是我在onBeforeCapture（）响应程序中检索正确的可拖动元素并编辑其尺寸的代码。在此响应器中更改尺寸与文档一致。这似乎仅在更改尺寸时有效，其他问题是我使用的是renderClone方法，因此，可拖动对象只是以不接近正确鼠标位置的巨大偏移进行拖动。 dnd还将放置占位符视为可拖动对象是原始的大尺寸。有什么方法可以纠正此鼠标位置和占位符尺寸吗？我已经研究过在可拖动的内部元素上添加mouseDown / mouseUp处理程序，但这似乎也不起作用。

const cardSize = 140;
const draggableAttr = "data-rbd-drag-handle-draggable-id";
const getAttr = (key: string, value: string) => `[${key}=${value}]`; 
const draggableQuery = getAttr(draggableAttr, update.draggableId);
const draggable = document.querySelector(draggableQuery);
draggable.setAttribute("style", `width: ${cardSize}px; height: ${cardSize}px;`);

Answer 1

我注意到onBeforeCapture在onDragEnd之后触发（因此不正确地调整了可拖动的大小），所以我创建了一个状态来记住最后一个beforeCaptureResult和return，如果它等同于当前结果。