c-movable-box/README.md

uniapp项目，基于movable-area和movable-view实现的拖拽组件，悬浮窗

npm下载量：![downloads](https://img.shields.io/npm/dt/c-movable-box)
# 欢迎使用 c-movable-box

## 安装
```javascript
// npm安装方式，插件市场导入无需执行此命令。插件市场导入地址：https://ext.dcloud.net.cn/plugin?id=22044
npm install c-movable-box
```

## 使用方法，不能每次拖动都修改coordinate，会有bug
```javascript
<template>
    <view class="box">
        <c-movable-box :coordinate="coordinate" @stopMove="stopMove">
            <button>测试</button>
        </c-movable-box>
    </view>
</template>

<script>
	// 以下导入方式按照安装方式导入，二选一
	// 插件市场不需要导入，直接使用c-movable-box
	// npm导入方法
	import cMovableBox from "c-movable-box";		
    export default {
        components: {
            cMovableBox
        },
        data() {
            return {
                coordinate: {
                    x: 0,
                    y: 100
                }
            }
        },
		methods: {
			stopMove(e) {
				console.log("停止移动后的x轴位置：", e.x);
				console.log("停止移动后的y轴位置：", e.y);
				// 这边每次拖动结束都赋值coordinate，会出现bug
				// this.coordinate = e;
			}
		}
    }
</script>
```

## API
### Props
|参数|说明|类型|默认值|可选值|支持的版本|
|--|--|--|--|--|--|
|gap|移动窗口距离可使用窗口的四周间距|Object|{top: 0, left: 0, right: 0, bottom: 0}|-|1.0.6+|
|is-hide-nav|h5环境关掉导航栏|Boolean|false|true|1.0.4+|
|disabled|禁止拖拽|Boolean|false|true|1.0.3+|
|is-custom-nav|自定义导航栏时值为true|Boolean|false|true|1.0.0+|
|coordinate|悬浮框的x轴和y轴|Object|{}|{ x: 0, y: 0 }|1.0.0+|
|z-index|悬浮框层级|Number|100|-|1.0.0+|

### Events
|事件名|说明|回调参数|支持的版本|
|--|--|--|--|
|stopMove|停止移动时，抛出去的方法|coordinate: {x: 0, y: 0}|1.0.0+|