我在使用dragula时遇到了一个问题。我使用的是vue2 dragula包装。
这是一把小提琴，它证明了这个问题，尽管我无法完成本身的拖拉工作
https://jsfiddle.net/Lscqm9je/
在我的电脑上，它按预期工作。唯一的问题是数据表列对齐。如果你看第一个表，我们会丢失标题/数据对齐，因为我在模板和tr 之间添加了一个div
<v-data-table v-bind:headers="headers" v-bind:items="items" hide-actions>
<template slot="items" scope="props">
<tbody v-dragula="tr" drake="first" class="container">
<tr>
<td class="text-xs-right">{{ props.item.round }}</td>
<td class="text-xs-right">{{ props.item.cat }}</td>
<td class="text-xs-right">{{ props.item.p1 }}</td>
<td class="text-xs-right">{{ props.item.p2 }}</td>
<td class="text-xs-right">{{ props.item.statut }}</td>
</tr>
</tbody>
</template>
</v-data-table>
所以我想在表模板和表行之间放一些东西是不允许的。但这是我找到的唯一能让dragula指令发挥作用的方法。该指令必须是可拖动元素(tr)的直接父级。我还试图将指令放入模板标记中，但这似乎不可能。
<template slot="items" scope="props" v-dragula="tr" drake="first" class="container">
我要找的是一张看起来像小提琴中的第二张桌子，但dragula指令有效。有人有主意吗？我是一个没有真正编程学位的初学者，所以这可能是一些愚蠢的事情，如果是的话，请提前道歉：)
谢谢。
更多信息：
这不起作用：
<template slot="items" scope="props" v-dragula="tr" drake="first" class="container">
<tr>
<td class="text-xs-right">{{ props.item.round }}</td>
这是有效的，但单元格是单独拖动的，而不是整行拖动
<template slot="items" scope="props">
<tr v-dragula="tr" drake="first" class="container">
<td class="text-xs-right">{{ props.item.round }}</td>
小提琴上的控制台正在发出警告
[Vue warn]: Property or method "tr" is not defined on the instance but referenced during render.
Make sure to declare reactive data properties in the data option.
(found in <Root>)
查看vue-dragula自述页面，v-dragula="..."应该指向数据集合，而不是元素，所以我认为它将是
<template slot="items" scope="props" v-dragula="items" drake="first" class="container">
这可能会让你走得更远。有一次，第二个表在拖动时显示了一个图标，但现在没有了，我不知道为什么。如果我得到任何进一步的线索，我会更新。
顺便说一句，<template>而不是<div>是首选，因为<table>对内部标签很敏感(尽管可能希望Vuetify来处理这个问题)。