vue 组件拖拽vue-slicksort应用

1.引入
import { SlickList, SlickItem, HandleDirective } from 'vue-slicksort'
2.注册组件
components: {
    SlickList,
    SlickItem
  },
3.应用
 
  

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

组件参数


组件方法：

HandleDirective
v-handle 指令在可拖动元素内部使用。（即用了这个指令，可以让拖动只在元素的某个位置生效）

Container 必须由 :useDragHandle 属性，且设置为 true 时才能正常工作。

项目中遇到两个问题：
1.拖拽的时候选中元素会跑到最下面
2.删除按钮的display: none 样式在拖拽组件中会失效，每次拖拽下面都会有一个❌
解决方法：
设置成行内样式
1.

2.