React Beautiful dnd转换功能组件

Question

我正在尝试将beautiful-dnd转换为功能组件并将它们拆分为不同的组件，但是我只是想知道为什么这会引发错误？

谢谢

Answer 1

task.js中存在问题。您忘记传播provided.dragHandleProps

import React from 'react'
import { Draggable } from 'react-beautiful-dnd'

const Task = props => {
  console.log(props)
  return (
    <Draggable draggableId={props.task.id} index={props.index}>
      {(provided, snapshot) => (
        <div
          ref={provided.innerRef} // <-- this as well
          {...provided.draggableProps}
          {...provided.dragHandleProps} // <-- here
        >
          {props.task.content}
        </div>
      )}
    </Draggable>
  )
}

export default Task