vue实现多栏布局自由拖拽，改变宽度

作者： 文章来源：

本文原地址：https://www.mimiwuqi.com/webqianduan/196479.html

1. 目标
2. 应用场景：
3. 组件设计
4. 实现
• dragBox 静态页面
• dragItem 页面
• 拖拽逻辑
• 在实现拖拽之前，应当给子元素（即：dragItem）进行合理布局。
• 拖拽实现逻辑

目标

vue 实现多个盒子（用户根据实际场景决定盒子数量）自由拖拽，改变宽度。

应用场景：

可自由拖动宽度的多栏布局。

最典型的案例：编辑器（eg:vscode,idea 等）

具体样式后期大家根据实际情况改，我这里只是完成效果，给大家一个参考，感谢阅读，码字不易，给个赞吧。

作者：你的小余童鞋

更多 建站教程 请访问 https://www.mimiwuqi.com/webqianduan/