关于vue.js:vue-element-组件添加拖动效果

应用 vuedraggable 插件

1. 装置 npm install vuedraggable -S(可能须要装置 Sortable)
2. 页面援用 import draggable from ‘vuedraggable’
3. 页面注册组件 components: {draggable}，通过 draggable 标签应用
4. 调用 update 办法，该办法事件返回新索引和旧索引，数据同样是响应式的

 <draggable v-model="postForm.recite" @update="datadragRecite">
    <div class="content-box" v-bind:key="index" v-for="(item, index) in postForm.recite" >
    <el-input v-model="item.text" type="textarea" rows="3" placeholder="请输出必背内容"/>
    </div>
 </draggable>

methods 办法

datadragRecite(evt) {console.log('拖动前的索引 :' + evt.oldIndex)
    console.log('拖动后的索引 :' + evt.newIndex);
}