react-rnd 拖拽组件

1.下载组件

npm install react-rnd

如果内网开发，组件下不下来，请移步 手动添加react-rnd

2.下好之后直接引用就好，方便的很

import { Rnd } from "react-rnd"

<Rnd 
    default={{
        x: 40,
        y: 40,
        width: 200,
        height: 200
    }}
    minWidth:{200}
    minHeight:{200}
    maxWidth:{200}
    maxHeight:{200}
    bounds="window"
>
这里可以随便写你想要的内容哈
</Rnd>

3.要注意的地方

react 都是组件构成 的，这个控件很可能会被别的组件遮挡，打开控制台找到对应的元素，设置一下层级就好了

.react-draggable {
    z-index: 100;
}

亲测有效呦 （づ￣3￣）づ╭❤～