v-virtual-scrollerを利用してバーチャルスクロールを実装したい

前提・実現したいこと

学習の中でTrello風のタスク管理アプリケーションを作成したく、実装中でおります。
チケットリストの中にdraggableを実装しているチケットを表示する様になっているのですが、
チケットリストに高さ制限を行い、高さ制限を超えた場合はバーチャルスクロールで続きのチケットが見ることができる様にしたいです。

発生している問題・エラーメッセージ

<v-virtual-scroll>を使用したところスクロールができる様になったのですが、
dataにあるarraylistを無限にループして表示している様で永遠とスクロールができる状態になってしまっております。
検証モードで見てみるとエラーではないですが、vue.draggableが非推奨という様なメッセージが出てきています。

エラーメッセージではないですが、vue.draggableが非推奨というメッセージが表示されています。
Options props is deprecated, add sortable options directly as vue.draggable item, or use v-bind. See https://github.com/SortableJS/Vue.Draggable/blob/master/documentation/migrate.md#options-props

該当のソースコード

 　　　<v-virtual-scroll
        :bench="0"
        :items="cards"
        height="350"
        item-height="350"
      >
        <draggable 
          tag="div"
          :list="cards"
          :options="{animation:600}"
          group="taskitems"
          @end="moveCard"
          @add="addCard"
        >
　　　　　//<card-list>はチケットをv-forで表示する子要素になります。
          <card-list v-for="(item,index) in cards"
              :key="item.cardid"
              :cardid="item.cardid"
              :cardtitle="item.cardtitle"
              :cardstarttime="item.start"
              :cardendtime="item.end"
              :cardenddate="item.enddate"
              :cardstatus="item.cardstatus"
              :cardindex="index"
              :cards="cards"
              :taskid="taskid"
              @deleted="cardsGet"
              />
　　　　　　
        </draggable>
      </v-virtual-scroll>

チケットデータであるcardsはaxiosで非同期でDBから取得しております。