0.0.5 • Published 5 years ago
vue-dragable v0.0.5
vue-dragable
A sortable list component for Vue!
Install
npm i -S vue-dragable
Example
// app's main.js
import Vue from "vue";
import vueDragable from "vue-dragable";
Vue.use(vueDragable);
<script>
export default {
data() {
return {
data: [{ id: '00', value: "0" }, { id: '11', value: "1" }, { id: '22', value: "2" }, { id: '33', value: "3" }, { id: '44', value: "4" }]
}
},
methods: {
onSort(data) {
console.log(data);
}
}
}
</script>
<template>
<el-form label-width="80px">
<dragable v-model="data" @sort="onSort">
<template slot-scope="{ data }">
<el-form-item v-for="(item, n) in data" :key="item.id" label="输入框:">
<el-input v-model="data[n].value"></el-input>
</el-form-item>
</template>
</dragable>
</el-form>
</template>
API
props
value/v-model
: {array} - a list data
events
sort
: Triggered when the list is sorted
- callback fun's params:
data
: {array} - new list data