我有一个要拖放的卡片列表。我希望用户可以通过按下特定位置进行拖放（div）在卡片上（不是整张卡）。我把这个div转移到子组件，并在这个div上添加**{... provided.dragHandleProps}**。一切正常，但我在控制台中出错，找不到拖动句柄。如何解决此问题？

const posts = (
      <DragDropContext onDragEnd={this.dragDrop}>
        <Droppable droppableId="dragCards">
          {(provided) => (
            <div ref={provided.innerRef}>
              {cards.map((item, index) => {
                return (                    
                      <Draggable draggableId={item.key} index={index}>
                        {(provided) => (
                          <div                    
                            ref={provided.innerRef}
                            {...provided.draggableProps}
                          >
                            <Cards                                                              
                              dragChip={
                                <div {...provided.dragHandleProps}>
                                  {dragChip}
                                </div>
                              }  />
                          </div>
                        )}
                      </Draggable>                       
                );
              })}
              {provided.placeholder}
            </div>
          )}
        </Droppable>
      </DragDropContext>
    );

这是div，我将它传递给子组件。

const dragChip = (
      <div >
        drag me
      </div>
    );