使用react-Beautiful-dnd，如何在拖动开始前更改可拖动尺寸(onBeforeCapture)

Question

这是我在onBeforeCapture()响应器中找到的代码，用于检索正确的可拖动元素并编辑其尺寸。在此响应器过程中更改尺寸符合文档说明。这似乎只适用于更改尺寸，其他问题是我使用的是renderClone方法，因此拖动对象只是拖动了一个巨大的偏移量，而不是接近正确的鼠标位置。此外，dnd将拖放占位符视为原始的大尺寸。有没有办法纠正鼠标的位置和占位符的尺寸？我曾考虑在draggable的内部元素上添加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，如果它等于当前结果的话。