React DND - 取决于组件状态的canDrag

Question

I'm facing a problem doing stuff with React-DND.

My question is about preventing dragging a component for a specific state. But "canDrag" can only have props and monitor as Parameters. (monitor.getItem shows null in my case) and I cannot use the props because these will be present in every component (since the props came from the parent component).

Does anyone has any idea solving this problem?

Thx

Answer 1

You can do it in component rather then in spec

@DragSource(dragtype, sourceSpec, cnt => ({
  connectDragSource: cnt.dragSource(),
}))
export default class Dragable extends React.Component {
  state = {
    canDrag: false,
  }
  render() {
   const { connectDragSource } = this.props;
   const { canDrag } = this.state;
   const cntDragSource = canDrag ? connectDragSource : i => i;
    return cntDragSource(
     <div className="drag-target" />
    )
  }
}