基于flex的可拖拽控制布局，类表格
npm install vue-drag-flex
main.js
import DragLayout from 'vue-drag-flex'
Vue.use(DragLayout)
# build for production with minification
npm run buildnpm install vue-drag-flex
import DragLayout from 'vue-drag-flex'
Vue.use(DragLayout)
<drag-layout mode="row" dl-height="200px" >
<drag-layout-item dl-height="100%" dl-width="300px" :min-height="50">
</drag-layout-item>
</drag-layou>
drag-layout
| 属性 | 可选值 | 类型 | 说明 |
|---|---|---|---|
| mode | column、row | String | 分别为纵向布局与横向布局 |
| dl-height | -- | String | 容器高度 |
| dl-width | -- | String | 容易宽度 |
drag-layout-item
| 属性 | 可选值 | 类型 | 说明 |
|---|---|---|---|
| dl-width | -- | String | 初始宽度 |
| dl-height | -- | String | 初始高度 |
| min-width | -- | Number | 最小宽度，建议最小设为50；此单位为px |
| min-height | -- | Number | 最小高度，建议最小设为50；此单位为px |
slot
| 名称 | 描述 |
|---|---|
| slider | 可通过插槽自定义slider样式，如不设置，则使用默认样式 |
drag-layout-item与drag-layout可互相嵌套，形成类似表格的布局
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent