A Vue component for drag selecting elements. Inspired by react-drag-select.
- Add
vue3-drag-select
to your project:
$ yarn add vue3-drag-select # or npm i --save vue3-drag-select
- Import the component and add it to your template:
import DragSelect from "vue3-drag-select";
export default {
components: {
"drag-select-container": DragSelect,
},
};
- Wrap the items that you want to be selectable in the
drag-select-container
with aselectorClass
property and a scoped slot:
<template>
<drag-select-container selectorClass="itemToBeSelected">
<template slot-scope="{ selectedItems }">
<!-- Your items here -->
</template>
</drag-select-container>
</template>
- Then write your own logic to make items look selected. For instance by applying a class.
MIT