Хочу сделать dnd в upload itemRender
Не могу найти примеры реализации драг ен дропа в itemRender использую ant design Пример на ant design есть но он с react-dnd и немного отличается от beautiful помогите кто сталкивался с таким
return (
<DragDropContext
onDragEnd={handleOnDragEnd}>
<Form.Item
name={fieldName}
valuePropName="fileList"
getValueFromEvent={getValueFromEvent}
noStyle
>
<Droppable
direction="horizontal"
droppableId="dnd">
{(provided, snapshot) => (
<div {...provided.droppableProps}
style={getListStyle(snapshot.isDraggingOver)}
ref={provided.innerRef}>
<Upload
name={fileFieldName}
action={UPLOAD_URL}
headers={getAuthHeaders()}
listType="picture-card"
data={(file: any) => {
return {
filename: file.name,
field: fileFieldName,
model: model
}
}}
maxCount={maxCount}
itemRender={(first, item, arr) => (
<Draggable key={arr.indexOf(item)}
draggableId={`${arr.indexOf(item)}`}
index={arr.indexOf(item)}>
{(provided, snapshot) => (
<div key={arr.indexOf(item)}
ref={provided.innerRef}
{...provided.draggableProps}
{...provided.dragHandleProps}
style={getItemStyle(
snapshot.isDragging,
provided.draggableProps.style
)}>{first}</div>
)}
</Draggable>
)}
>
<UploadButton />
</Upload>
{provided.placeholder}
</div>
)}
</Droppable>
</Form.Item>
</DragDropContext>
);