Vue-Dragula 不显示动画

问题描述

我只是在尝试使用 VueDragula，这就是我所做的：

let vm = new Vue({
    el: '#wrapper',data: {
      colOne:["hi","you"]
    },methods:{
        onClick:function(){
            alert()
        }
    }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-dragula@1.3.1/dist/vue-dragula.min.js"></script>
<div id="wrapper">
      <div class="wrapper">
        <div class="container" v-dragula="colOne" bag="first-bag">
          <!-- with click -->
          <div v-for="text in colOne">{{text}} <span  @click="onClick">[click me]</span></div>
        </div>
      </div>
    </div>

但不知何故，只是没有动画，拖动的元素显示在列表底部？

Here are the official examples

我做错了什么？

解决方法

您忘记加载 vue-dragula 的样式。从目录 /styles 导入样式。您可能想要导入缩小的 css 样式：

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/vue-dragula@1.3.1/styles/dragula.min.css" />