awesome-repositories.com
博客
MCP
awesome-repositories.com

通过 AI 驱动的搜索,发现最优秀的开源仓库。

探索精选搜索开源替代品自托管软件博客网站地图
项目关于排名机制媒体报道MCP 服务器
法律隐私政策服务条款
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
SortableJS avatar

SortableJS/Vue.Draggable

0
View on GitHub↗

AI 搜索

探索更多 awesome 仓库

用简单的语言描述您的需求 —— AI 将根据相关性为您从数千个精选开源项目中进行排序。

Start searching with AI
sortablejs.github.io/Vue.Draggable
↗

Vue.Draggable

Vue.Draggable is a component-based library for Vue.js that enables drag-and-drop functionality within web interfaces. It functions as a wrapper for the SortableJS engine, bridging the gap between imperative DOM manipulation and the declarative nature of the Vue.js reactive system. By synchronizing user interface interactions with the underlying data model, it ensures that list reordering and element movement are automatically reflected in the application state.

The library supports complex interaction patterns, including the ability to move items between lists, clone elements using keyboard modifiers, and organize data within nested hierarchies. It provides granular control over user interactions by allowing developers to restrict dragging to specific handle elements, ensuring that drag-and-drop operations do not interfere with other interface components.

Beyond basic reordering, the library facilitates the creation of dynamic layouts, including support for tables and deeply nested structures. It incorporates visual feedback mechanisms by applying animations during list transitions, helping users track element movement within the interface. The package is distributed as a standard Vue.js component, allowing for integration into existing component trees.

Features

  • Drag and Drop Libraries - Implements intuitive drag-and-drop interfaces within Vue applications for reordering and data management.
  • Vue.js Drag-and-Drop Libraries - Provides a declarative drag-and-drop interface that automatically synchronizes list reordering with the underlying Vue.js data model.
  • Declarative Component Libraries - Provides a declarative component wrapper that bridges imperative drag-and-drop logic with the reactive framework lifecycle.
  • Interaction Libraries - Enables complex interactive interface patterns including nested hierarchies, item cloning, and restricted drag handles for touch-friendly web applications.
20,626 星标·2,877 分支·JavaScript·mit·6 次浏览
  • List Reordering Components - Builds dynamic lists that support reordering, cloning, and moving items while keeping data synchronized.
  • Real-time Data Synchronization - Synchronizes the underlying data model in real time as users rearrange items.
  • State-Synchronized Bindings - Ensures visual changes from drag-and-drop interactions are immediately reflected in the application data store.
  • Reactive Data Binding - Automatically synchronizes the underlying application state whenever the visual order of elements changes.
  • Centralized State Stores - Connects drag-and-drop actions to centralized state stores to ensure consistency across the application.
  • Nested Drag Containers - Enables organizing complex data by moving items into or out of nested containers during drag operations.
  • List Transition Animations - Applies smooth visual motion to items during reordering to provide clear feedback during layout changes.
  • CSS Transitions - Leverages browser-native CSS transitions to animate list reordering and layout changes.
  • Drag Handles - Limits draggable areas to specific handle elements to prevent accidental movement during user interaction.
  • Drag-and-Drop Cloning - Supports duplicating items between lists during drag operations using keyboard modifiers.
  • Star 历史

    sortablejs/vue.draggable 的 Star 历史图表sortablejs/vue.draggable 的 Star 历史图表

    Vue.Draggable 的开源替代方案

    相似的开源项目,按与 Vue.Draggable 的功能重合度排序。
    • sortablejs/sortableSortableJS 的头像

      SortableJS/Sortable

      31,135在 GitHub 上查看↗

      Sortable is a framework-agnostic JavaScript library for creating reorderable lists through drag and drop interactions. It functions as a reorderable list manager that allows users to rearrange DOM elements using pointer interactions on modern browsers and touch devices. The library enables the transfer or cloning of items between different lists using shared group identifiers. It supports complex organizational structures, including nested reorderable lists for managing hierarchical data across different levels. Its capabilities cover the animation of element movements and the configuration

      JavaScriptdragdrag-and-dropdrag-drop
      在 GitHub 上查看↗31,135
    • bevacqua/dragulabevacqua 的头像

      bevacqua/dragula

      22,160在 GitHub 上查看↗

      Dragula is a JavaScript drag and drop library and DOM element manipulator used to move and reorder HTML elements between multiple containers. It functions as a UI interaction framework and event manager that tracks drag lifecycles to facilitate the movement of elements within a web browser interface. The library distinguishes itself through configurable constraint validation, allowing developers to define which elements are draggable and which containers are permitted drop targets. It supports specialized interaction patterns such as element cloning, the use of specific drag handles to restri

      JavaScriptcomponentdrag-and-dropdrag-drop
      在 GitHub 上查看↗22,160
    • rubaxa/sortableRubaXa 的头像

      RubaXa/Sortable

      31,135在 GitHub 上查看↗

      Sortable is a JavaScript drag and drop library used to create reorderable lists of HTML elements. It is a framework-agnostic tool and a touch-enabled interaction library that functions across modern browsers and touch devices without dependencies on specific web frameworks. The library enables the movement and cloning of elements between different containers using shared group configurations. It supports the repositioning of multiple items simultaneously and the use of specific drag handles to restrict which areas of an element trigger a move. Additional capabilities include programmatic sor

      JavaScript
      在 GitHub 上查看↗31,135
    • alfred-skyblue/vue-draggable-plusAlfred-Skyblue 的头像

      Alfred-Skyblue/vue-draggable-plus

      4,001在 GitHub 上查看↗

      vue-draggable-plus is a drag-and-drop library for Vue 2 and Vue 3 used to create data-bound draggable interfaces. It provides components for implementing list sorting and reordering elements within a sequence while synchronizing the visual position of items with the underlying application state. The library includes a cross-list transfer tool that enables the movement of items between multiple containers using shared group identifiers and cloning rules. Interaction can be restricted to specific child elements through handle-based triggering. The project covers a broad range of drag-and-drop

      Vuecomposition-apidragdrag-and-drop
      在 GitHub 上查看↗4,001
    查看 Vue.Draggable 的所有 30 个替代方案→

    常见问题解答

    sortablejs/vue.draggable 是做什么的?

    Vue.Draggable is a component-based library for Vue.js that enables drag-and-drop functionality within web interfaces. It functions as a wrapper for the SortableJS engine, bridging the gap between imperative DOM manipulation and the declarative nature of the Vue.js reactive system. By synchronizing user interface interactions with the underlying data model, it ensures that list reordering and element movement are automatically reflected in the application state.

    sortablejs/vue.draggable 的主要功能有哪些?

    sortablejs/vue.draggable 的主要功能包括:Drag and Drop Libraries, Vue.js Drag-and-Drop Libraries, Declarative Component Libraries, Interaction Libraries, List Reordering Components, Real-time Data Synchronization, State-Synchronized Bindings, Reactive Data Binding。

    sortablejs/vue.draggable 有哪些开源替代品?

    sortablejs/vue.draggable 的开源替代品包括: sortablejs/sortable — Sortable is a framework-agnostic JavaScript library for creating reorderable lists through drag and drop interactions.… bevacqua/dragula — Dragula is a JavaScript drag and drop library and DOM element manipulator used to move and reorder HTML elements… rubaxa/sortable — Sortable is a JavaScript drag and drop library used to create reorderable lists of HTML elements. It is a… alfred-skyblue/vue-draggable-plus — vue-draggable-plus is a drag-and-drop library for Vue 2 and Vue 3 used to create data-bound draggable interfaces. It… sortablejs/vue.draggable.next — This project is a drag-and-drop UI library and a Vue 3 component for implementing sortable lists and state-synced… clauderic/dnd-kit — This project is a modular toolkit for building accessible, component-based drag-and-drop interfaces in React. It…