更新记录

1.0.3（2025-02-28） 下载此版本

增加disabled属性

1.0.0（2025-02-05） 下载此版本

初次发布

平台兼容性

欢迎使用 c-movable-box

安装

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

使用方法

<template>
    <view class="box">
        <!-- 方式一 -->
        <movable-box>
            <button>测试1</button>
        </movable-box>
        <!-- 方式二 -->
        <movableBox :coordinate="coordinate" @stopMove="stopMove">
            <button>测试2</button>
        </movableBox>
    </view>
</template>

<script>
    // 以下导入方式按照安装方式导入，二选一
    import movableBox from '@/components/c-movable-box/c-movable-box.vue';      // 插件市场导入方法
    import movableBox from "@/node_modules/c-movable-box/c-movable-box.vue";        // npm导入方法
    export default {
        components: {
            movableBox
        },
        data() {
            return {
                coordinate: {
                    x: 0,
                    y: 100
                }
            }
        },
        methods: {
            stopMove(e) {
                console.log("停止移动后的x轴位置：", e.x);
                console.log("停止移动后的y轴位置：", e.y);
            }
        }
    }
</script>

API

Props

Events