5

在文档中它说：

DragHandleProps需要应用到您想成为拖动手柄的节点。这是需要应用于<Draggable />节点的一些道具。最简单的方法是将道具散布到可拖动节点（{...provided.dragHandleProps}）上。但是，如果您还需要响应它们，也欢迎您对这些道具进行修补。DragHandleProps将null何时isDragDisabled设置为true。

dragHandleProps类型信息

type DragHandleProps = {|
  // what draggable the handle belongs to
  'data-rbd-drag-handle-draggable-id': DraggableId,

  // What DragDropContext the drag handle is in
  'data-rbd-drag-handle-context-id': ContextId,

  // Id of hidden element that contains the lift instruction (nicer screen reader text)
  'aria-labelledby': ElementId,

  // Allow tabbing to this element
  tabIndex: number,

  // Stop html5 drag and drop
  draggable: boolean,
  onDragStart: (event: DragEvent) => void,
|};

我想附加onDragStart到 ，Draggable以便仅在拖动特定的一组元素时触发它（而不是将其附加到DragDropContext）。使用我做的文档中的示例：

<Draggable draggableId="draggable-1" index={0}>
  {(provided, snapshot) => (
    <div
      ref={provided.innerRef}
      {...provided.draggableProps}
      {...provided.dragHandleProps}
      onDragStart={() => console.log('onDragStart')}
    >
      Drag me!
    </div>
  )}
</Draggable>

但是它似乎不起作用。任何想法如何使它工作？

4

2 回答 2

2

它只能在 DragDropContext 中用于 Draggable 元素。

<DragDropContext
         onDragStart={()=>{alert('onDragStart')}}
         onDragEnd={()=>{alert('onDragEnd')}}>
</DragDropContext>
于 2020-03-09T06:38:43.460 回答
1

onDragStart并且onDragEnd只是组件的事件DragDropContext。

于 2020-03-08T22:36:09.693 回答