reactjs - React DND - canDrag 根据组件状态

Question

我在使用 React-DND 时遇到问题。

我的问题是关于防止将组件拖动到特定状态。但“canDrag”只能将 props 和 monitor 作为参数。 (在我的例子中，monitor.getItem 显示为 null)并且我无法使用这些 Prop ，因为这些 Prop 将出现在每个组件中(因为这些 Prop 来自父组件)。

有人有办法解决这个问题吗？

谢谢

Answer 1

您可以在组件中而不是在规范中完成

@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" />
    )
  }
}