如何使用vue.draggable拖动多行？

Question

我想连续拖动多个表数据而不是单个td标记。换句话说，当我拖动任一列时，我想将“随机”和“名称”列拖到一起。

<table id="app">
  <tr>
    <th>Random</th>
    <th>name</th>
  </tr>

  <tr>
    <td>    
      <draggable v-model="items">
        <transition-group name="list-complete">
          <div v-for="item in items"
               v-bind:key="item.message"
               class="list-complete-item">
            {{ item.message }}
          </div>
        </transition-group>
      </draggable>
    </td>

    <td>
      <div v-for="item in items" class="list-complete-item">
        {{ item.name }}
      </div>
    </td>

  </tr>
</table>

我已尝试使用draggable标签和transition-group标签进行移动和播放，但似乎没有任何效果。

请帮忙。 :(

这是我的jsfiddle代码 - > https://jsfiddle.net/wusprtnL/63/