Method render

examples/03 Nesting/Drag Sources/TargetBox.js:36–62

()

  };

  render() {
    const { canDrop, isOver, draggingColor, lastDroppedColor, connectDropTarget } = this.props;
    const opacity = isOver ? 1 : 0.7;

    let backgroundColor = '#fff';
    switch (draggingColor) {
      case Colors.BLUE:
        backgroundColor = 'lightblue';
        break;
      case Colors.YELLOW:
        backgroundColor = 'lightgoldenrodyellow';
        break;
      default:
        break;
    }

    return connectDropTarget(
      <div style={{ ...style, backgroundColor, opacity }}>

        <p>Drop here.</p>

        {!canDrop && lastDroppedColor &&
          <p>Last dropped: {lastDroppedColor}</p>
        }
      </div>,
    );
  }
}

export default class StatefulTargetBox extends Component {