Skip to content
This repository was archived by the owner on Sep 4, 2019. It is now read-only.
This repository was archived by the owner on Sep 4, 2019. It is now read-only.

Unable to make droppablezone work #9

@andeersg

Description

@andeersg

Hi,
So cool that you are porting this library.

I have a problem with making the elements droppable in droppablezones.

This is a modified version of your example:

render() {
    return (
      <div className="App">
        <div className="App-body">
          <DraggableContainer
            as="div"
            type="droppable"
            className="BlockGenerator"
            droppable="drag__drop"
            draggable="drag__element"
          >
            {Array.from(Array(this.state.blockCount).keys()).map(number => (
              <DraggableItem
                as="div"
                className="drag__element"
                style={{ backgroundColor: randomColor() }}
              >
                {number}
              </DraggableItem>
            ))}

            <DroppableZone />
            <DroppableZone />
            <DroppableZone />
            <DroppableZone />

          </DraggableContainer>
        </div>
      </div>
    );
  }

Shouldn't this make the elements droppable in the droppablezones? Or am I missing something? When type="droppable" the elements will not be dragged around, but I see they get a class draggable--original. When I change type to draggable I can move them around, but not drop them.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions