{"id":13518354,"url":"https://github.com/james2doyle/vue-drag-and-drop","last_synced_at":"2025-03-31T09:31:29.528Z","repository":{"id":57129759,"uuid":"47739822","full_name":"james2doyle/vue-drag-and-drop","owner":"james2doyle","description":"A for Vue.js directive for providing drag and drop capabilities to elements and data","archived":true,"fork":false,"pushed_at":"2018-03-26T02:27:15.000Z","size":44,"stargazers_count":386,"open_issues_count":3,"forks_count":71,"subscribers_count":18,"default_branch":"master","last_synced_at":"2025-03-03T05:32:34.244Z","etag":null,"topics":["drag","drop","vuejs"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/james2doyle.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-12-10T05:24:22.000Z","updated_at":"2025-01-14T07:47:58.000Z","dependencies_parsed_at":"2022-08-31T19:22:37.181Z","dependency_job_id":null,"html_url":"https://github.com/james2doyle/vue-drag-and-drop","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/james2doyle%2Fvue-drag-and-drop","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/james2doyle%2Fvue-drag-and-drop/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/james2doyle%2Fvue-drag-and-drop/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/james2doyle%2Fvue-drag-and-drop/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/james2doyle","download_url":"https://codeload.github.com/james2doyle/vue-drag-and-drop/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246446927,"owners_count":20778893,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["drag","drop","vuejs"],"created_at":"2024-08-01T05:01:43.895Z","updated_at":"2025-03-31T09:31:29.253Z","avatar_url":"https://github.com/james2doyle.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# vue-drag-and-drop\n\nA directive for providing drag and drop capabilities to elements and data.\n\n### Install\n\nAvailable through `npm install vue-drag-and-drop` or include as an inline script, like in `example.html`.\n\n### Mobile Support\n\nThis library simply wraps the native drag and drop in html5. There is no support, and probably never will be any, for native \"drag and drop\" on mobile. See this [chart](http://caniuse.com/#feat=dragndrop).\n\nThe reason for this is that touch devices already have the necessary events (touch events) to implement drag and drop without need the additional apis that the desktop drag and drop has.\n\nIf you need a cross-platform solution, you should check out [this awesome library called pep!](http://pep.briangonzalez.org/).\n\n### Demo\n\n![demo gif](http://cl.ly/2B3j0g2K412y/Screen%20Recording%202015-12-09%20at%2009.23%20PM.gif)\n![demo gif 2](http://cl.ly/3v2V3w1n3y2D/Screen%20Recording%202015-12-10%20at%2002.36%20PM.gif)\n\nYou can load up the `example.html` file here to test the directive.\n\n### Usage\n\nHere is how you might typically use this directive:\n\n```html\n\u003cli v-for=\"task in tasks\" v-bind:id=\"task.id\" v-drag-and-drop v-on:drop=\"handleDrop\" v-text=\"task.title\"\u003e\u003c/li\u003e\n```\n\nThis directive assumes you are using it *inside* of some sort of list of elements.\n\nYou can see a `Vue` instance in `example.html` if you want more details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjames2doyle%2Fvue-drag-and-drop","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjames2doyle%2Fvue-drag-and-drop","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjames2doyle%2Fvue-drag-and-drop/lists"}