大家好,我是Echa。 今天来推荐8个简单又好用的前端拖拽排序库!1。ReactBeautifulDnd reactbeautifuldnd这是一款美观且简单易用的React列表拖拽库。其动画效果自然,性能优秀,简洁而强大的API,易于上手,与标准浏览器的互动性非常好。 Github(27。5k):https:github。comatlassianreactbeautifuldnd2。Sortable Sortable是一个JavaScript拖拽库,用于在现代浏览器和触摸设备上对拖放列表进行重新排序。支持Meteor、AngularJS、React、Polymer、Vue、Ember、Knockout和任何CSS库。 Github(25。3k):https:github。comSortableJSSortable3。Dragula Dragula是一个JavaScript库,实现了网页上的拖放功能。提供JavaScript、AngularJS和React版本。 Github(21。3k):https:github。combevacquadragula4。ReactDnD ReactDnD是React和Redux核心作者DanAbramov创造的一组React高阶组件,可帮助我们构建复杂的拖放界面,同时保持组件解耦。它可以在应用程序的不同部分之间通过拖动传输数据,并且组件会更改其外观和应用状态以响应拖放事件。 Github(18k):https:github。comreactdndreactdnd5。Vue。Draggable Vue。Draggable是基于Sortable。js的Vue拖放组件。它允许拖放和视图模型数组同步,基于并提供Sortable。js的所有功能。该库适用于Vue2,如果想在Vue3中使用该库,可以访问:https:github。comSortableJSvue。draggable。next。 Github(17。7k):https:github。comSortableJSVue。Draggable6。interact。js interact。js是一个适用于现代浏览器的JavaScript拖放库,支持调整大小和多点触控手势,具有惯性和捕捉功能。为了尽可能多地提供控制,它尝试提供一个简单、灵活的API,该API提供移动元素所需的所有拖拽API。 Github(11k):https:github。comtayeinteract。js7。ReactDraggable ReactDraggable库简单易用,将CSS中的transform应用于React组件,允许我们在UI中拖动组件。它有不同的props可以让你改变组件的行为,是创建直观、用户友好界面的绝佳选择。 Github(7。7k):https:github。comreactgridlayoutreactdraggable8。ReactSortableTree ReactSortableTree是一个用于对分层数据进行拖放式可排序表示的React组件。它支持单选多选,鼠标拖拽子集到新合集,模糊搜索等。 Github(4。5k):https:github。comfrontendcollectivereactsortabletree