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