Vue+ElementUI技巧分享：结合Sortablejs实现表格行拖拽_vue element-ui 实现表格拖拽

---

前言

在很多动态网页应用中，用户界面的交互性是提高用户体验的关键。在 Vue.js 中，结合 Element UI 和 sortablejs，我们可以轻松实现表格的行拖拽功能。本文将演示如何在 Vue 项目中使用这些工具，并在拖拽后将数据更新到后端服务系统。

---

准备工作

确保你的项目中已经安装了 Element UI 和 sortablejs。如果还没有安装，可以通过以下命令进行安装：

npm install element-ui sortablejs

在你的主入口文件（如 main.js 或 app.js）中引入 Element UI 和其样式：

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

示例代码

以下是一个包含表格行拖拽功能的 Vue 组件示例：

<template>
  <div>
    <el-table :data="planTableData"
              row-key="id">
      <el-table-column prop="createTime"
                       label="日期"