# 工位地图

**Repository Path**: chen-tian-sleeps/vue3-workstation-map

## Basic Information

- **Project Name**: 工位地图
- **Description**: 使用 vue3 框架，配合 vue3-draggable-resizable 拖拽实现工位地图。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2024-07-25
- **Last Updated**: 2025-07-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 使用 vue3-draggable-resizable - {Vue3DraggableResizable} [vue3-draggable-resizable](https://github.com/a7650/vue3-draggable-resizable/blob/main/docs/document_zh.md)

- initW：初始化宽度，默认 null，单位 px
- initH：初始化高度，默认 null，单位 px
- v-model:x：距离父容器左侧的距离，默认 0，单位 px
- v-model:y：距离父容器顶部的距离，默认 0，单位 px
- v-model:w：组件当前的宽度，默认 0，单位 px
- v-model:h：组件当前的高度，默认 0，单位 px
- v-model:active：组件当前是否处于活跃状态，默认 false，类型 Boolean
- minH：最小高度，默认 20，单位 px
- minW：最小宽度.默认 20，单位 px
- draggable：是否可拖动，是否可调整大小，默认 true，
- lockAspectRatio：是否启动锁定比例，默认 fasle，
- disabledX：是否禁止组件在 x 轴上移动，默认 false
- disabledY：是否禁止组件在 y 轴上移动，默认 false
- disabledW：是否禁止组件修改宽度，默认 false
- disabledH：是否禁止组件修改高度，默认 false
- resizable ？？？
- parent：是否将组件的拖动与缩放限制在父元素的区域内，组件不可超出父元素容器，默认 false
- classNameDraggable：该类名在组件是可拖动时展示
- classNameResizable：该类名在组件是可缩放时展示
- classNameDragging：该类名在组件在拖动时展示
- classNameResizing：该类名在组件在缩放时展示
- classNameActive：该类名在组件在活跃状态时展示
- @activated：组件从非活跃状态到活跃状态时触发
- @deactivated：组件从活跃状态到非活跃状态时触发
- @drag-start：组件开始拖动时触发
- @dragging：组件在拖动过程中持续触发
- @drag-end：组件拖动结束时触发
- @resize-start：组件开始缩放时触发
- @resizing：组件在缩放过程中持续触发
- @resize-end：组件缩放结束时触发
- <DraggableContainer / > ：吸附对其组件包裹