vue draggable

● vue draggableのインストール

インストール

yarn add vuedraggable

cssがめんどくさい場合は bootstrapも入れておきましょう

yarn add bootstrap-vue

コレクションの操作がめんどくさい場合は lodashも入れておきましょう

yarn add lodash
yarn add @types/lodash

xhr を使用するときは axios も入れておきましょう

yarn add axios

main.js に 以下も追加します

import Axios from 'axios'
Vue.use(Axios)

● TypeScript用 ファイルの作成

mkdir src/types
vi src/types/vuedraggable.d.ts

src/types/vuedraggable.d.ts

declare module 'vuedraggable'

● 片方のリストからもう片方のリストコピーをさせる

コピーをさせたいリストを次のように変更します

    <draggable
      group="items"
    >

    <draggable 
      :group="{ name: 'items', pull: 'clone', put: false }"
    >
No.1958
03/05 22:32

edit