# cf-vue-draggable

> Vue component allowing drag-and-drop sorting in sync with View-Model

Latest version **0.2.0** (published 2018-11-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install cf-vue-draggable
pnpm add cf-vue-draggable
yarn add cf-vue-draggable
bun add cf-vue-draggable
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2018-11-15 |
| First published | 2018-11-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 6.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | jiebaomaster@gmail.com |
| Maintainers | jbmaster |
| Keywords | Vuejs, draggable, sort |

## Links

- npm: https://www.npmjs.com/package/cf-vue-draggable
- Repository: https://github.com/jiebaomaster/particlesJS
- Homepage: https://github.com/jiebaomaster/particlesJS#readme
- Issues: https://github.com/jiebaomaster/particlesJS/issues
- npm.io page: https://npm.io/package/cf-vue-draggable

## Recent versions

- 0.2.0 (latest) — 2018-11-15
- 0.1.0 — 2018-11-15

## README

# cf-vue-draggable

Vue component allowing drag-and-drop sorting in sync with View-Model

## Excemple

```html
<!--base-->
<draggable :list='list' :element='"ul"'>
  <li v-for='item in list'>
    <span>{{ item }}</span>
  </li>
</draggable>

<!--with transition-group-->
<draggable :list='list' :element='"ul"'>
  <transition-group name='flip-list'>
    <li v-for='item in list' :key='item'>
      <span>{{item}}</span>
    </li>
  </transition-group>
</draggable>
```

## Feature

version 0.2.0

- support transition-group component

version 0.1.0

- provide a vuejs component for draggable sort.
- support custom parent element, such as: ul, tbody
- emit event when start drag and stop drag

### todo

1. transition
2. draggable-icon component. Become draggable when mouse hover

## Test

need `browser-sync`

on shell `npm run test`, will open a develop server on `localhost:3000`

_please forgive my poor english_

---
_Source: https://npm.io/package/cf-vue-draggable · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._