Javascript 反应集可拖动antd模式

我正在尝试添加一个带有拖放功能的antd模式

import React, { Component } from "react";
import Draggable from "react-draggable";
import { Modal } from 'antd';
import 'antd/dist/antd.css';
export default class App extends Component {
  state = {
    disabled: false
  };

  render = () => {
    const { disabled } = this.state;
    return (
      <div className="container">
          <Modal visible>
          <Draggable>
          <div>
            <h4 style={{ height: 20, userSelect: "none" }}>
              {"Drag Me"}
            </h4>
            <textarea disabled={!disabled} className="uk-textarea" />

            <br />
            </div>
        </Draggable>
          </Modal>
      </div>
    );
  };
}

import React，{Component}来自“React”；
从“react Draggable”导入Draggable；
从“antd”导入{Modal}；
导入“antd/dist/antd.css”；
导出默认类应用程序扩展组件{
状态={
禁用：false
};
渲染=（）=>{
const{disabled}=this.state；
返回(
{“拖我走”}


);
};
}

这是我的sanbox代码，但似乎ant modal元素中的react draggable不起作用，如果我可以将元素“ant modal content”设置为draggable元素，则可能无法工作

有人知道是否可以通过道具将Dragable元素放入react Dragable中吗

我也可以改变拖放包，我只需要能够拖动一个antd模式

只需将您的

放在

中，而不要放在相反的位置

    return (
      <div className="container">
        <Modal visible>
          <Draggable>
            <div>
              <h4 style={{ height: 20, userSelect: "none" }}>{"Drag Me"}</h4>
              <textarea disabled={!disabled} className="uk-textarea" />

              <br />
            </div>
          </Draggable>
        </Modal>
      </div>
    );

返回(
{“拖我走”}


);

只要把你的

放在你的

里面，不要放在相反的位置

    return (
      <div className="container">
        <Modal visible>
          <Draggable>
            <div>
              <h4 style={{ height: 20, userSelect: "none" }}>{"Drag Me"}</h4>
              <textarea disabled={!disabled} className="uk-textarea" />

              <br />
            </div>
          </Draggable>
        </Modal>
      </div>
    );

返回(
{“拖我走”}


);

不，在这种情况下，我可以只拖放内容，而不拖放modaloh，我现在就知道了。然后看看这个不，在这种情况下，它让我有可能只拖放内容，而不是modaloh，我现在明白了。那么看看这个