更新记录
1.0.1(2021-06-14) 下载此版本
无
平台兼容性
Vue2 | Vue3 |
---|---|
√ | × |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 2.8.1 | × | × | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | × | × | × | × | × |
better-draggable-ball
这是一款使用纯TYPESCRIPT开发的可拖拽悬浮球,这意味着它不需要安装其他依赖即可直接导入到你的开发项目当中使用
最简单的使用方法
第一步,您需要在您的项目中安装它,执行以下命令
npm install better-draggable-ball --save
在您的项目中导入BetterGraggbleBall
import BDrag from 'better-draggable-ball';
创建一个div,并给他设置一个ID值和样式
<div class="root">
<div class="BDrag"></div>
</div>
.drag{
width: 50px;
height: 50px;
background-color: rgb(238, 238, 238);
border-radius: 50%;
border: 5px solid rgb(170, 170, 170);
}
BetterGraggbleBall
提供了一个类,实例化的第一个参数是一个原生DOM元素
const BDragDom = document.getElementById('BDrag')
const BDrag = new BDrag(BDragDom)