Javascript 如何使reactstrap模式具有可调整大小和可拖动的动态内容？

我想让reactstrap模式具有来自另一个组件的动态内容，可以调整大小和拖动

我的代码：

    <Draggable>
      <Modal isOpen={modal} toggle={this.toggle}>
        <ModalHeader toggle={this.toggle}>Add/Edit</ModalHeader>
        {modal ?
          <ModalBody>
            {this.props.dynamicComponent}
          </ModalBody> : ''}
      </Modal>
    </Draggable>

添加/编辑
{模态？
{this.props.dynamicComponent}
: ''}

我已经通过使用实现了可拖动，但我对可调整大小有问题。我已经使用了and，但是如果

之前的

标记，它们都会在模态打开之前和打开后创建空间，但可调整大小的功能不起作用

---

我已将

标记放在

之后，可调整大小功能不起作用。

我没有找到完整答案，因此我决定删除可拖动功能，只将可调整大小功能添加到模式中，因此我将此CSS代码添加到模式中：

.modal-content{
border: 2px solid;
resize: both;
overflow: auto;}

---

我没有找到完整的答案，所以我决定删除Draggable，只在model中添加resizeable，所以我在model中添加了以下CSS代码：

.modal-content{
border: 2px solid;
resize: both;
overflow: auto;}