You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Use it exactly as v-for directive, passing optional parameters using 'options' parameter.
162
-
Options parameter can be json string or a full javascript object.
163
-
164
-
``` html
165
-
<div v-dragable-for="element in list1" options='{"group":"people"}'>
166
-
<p>{{element.name}}</p>
167
-
</div>
168
-
```
169
-
170
-
###Limitation
171
-
172
-
* This directive works only when applied to arrays and not to objects.
173
-
* `onStart`, `onUpdate`, `onAdd`, `onRemove` Sortable.js options hooks are used by v-dragable-for to update VM. As such these four options are not usable with v-dragable-for. If you need to listen to re-order events, you can watch the underlying view model collection. For example:
Use it exactly as v-for directive, passing optional parameters using 'options' parameter.
4
+
Options parameter can be json string or a full javascript object.
5
+
6
+
```html
7
+
<divv-dragable-for="element in list1"options='{"group":"people"}'>
8
+
<p>{{element.name}}</p>
9
+
</div>
10
+
```
11
+
12
+
###Limitation
13
+
14
+
* This directive works only when applied to arrays and not to objects.
15
+
*`onStart`, `onUpdate`, `onAdd`, `onRemove` Sortable.js options hooks are used by v-dragable-for to update VM. As such these four options are not usable with v-dragable-for. If you need to listen to re-order events, you can watch the underlying view model collection. For example:
16
+
```js
17
+
watch: {
18
+
'list1':function () {
19
+
console.log('Collection updated!');
20
+
},
21
+
```
22
+
###fiddle
23
+
Simple:
24
+
https://jsfiddle.net/dede89/j62g58z7/
25
+
26
+
Two Lists:
27
+
https://jsfiddle.net/dede89/hqxranrd/
28
+
29
+
Example with list clone:
30
+
https://jsfiddle.net/dede89/u5ecgtsj/
31
+
32
+
## Installation
33
+
- Available through:
34
+
``` js
35
+
npm install vuedraggable
36
+
```
37
+
``` js
38
+
Bower install vue.draggable
39
+
```
40
+
41
+
Version 1.0.9 is Vue.js 1.0 compatible <br>
42
+
43
+
- #### For Modules
44
+
45
+
``` js
46
+
// ES6
47
+
//For Vue.js 1.0 only
48
+
importVueDraggablefrom'vuedraggable'
49
+
importVuefrom'vue'
50
+
Vue.use(VueDraggable)
51
+
52
+
// ES5
53
+
//For Vue.js 1.0
54
+
var Vue =require('vue')
55
+
Vue.use(require('vuedraggable'))
56
+
```
57
+
58
+
- #### For `<script>` Include
59
+
60
+
Just include `vuedraggable.min.js` or 'vue.dragable.for' after Vue.<br>
61
+
lodash(version >=3) is needed only for Vuejs. 1.0 version of the library.
0 commit comments