用React实现一个漂亮的可拖放的列表——react-beautiful-dnd!

重排兼容- 表模式
  • 自动滚动 -拖动时根据需要自动滚动容器和窗口(即使使用键盘也是如此))
  • 自定义拖动手柄-可以拖动整个项目的一部分
  • 能够在拖动时将拖动的项目移动到另一个元素- 父级化
  • 创建脚本化的拖放体验
  • 允许扩展支持您喜欢的任何输入类型
  • 通过@atlaskit/tree包提供树支持
  • 一个列表可以滚动容器(没有父级滚动)或者成为滚动容器的子代(也没有一个滚动的父母)
  • 独立的嵌套列表-列表可以是另一个列表的子级,但是您不能将项目从父级列表拖到子级列表中
  • 与服务器端呈现(SSR)兼容
  • 默认情况下,可与嵌套的交互式元素一起很好地交互

  • 用React实现一个漂亮的可拖放的列表——react-beautiful-dnd!


    说在后面

    有很多库允许在React中进行拖放交互。其中最值得注意的是react-dnd。它在提供大量的拖放原语方面做得非常出色,与原始不一致的html5拖放功能配合使用特别好。react-beautiful-dnd是专门为列表(垂直,水平,列表之间的移动,嵌套列表等)构建的更高级别的抽象。在该功能子集中,react-beautiful-dnd提供了强大,自然和优雅的拖放体验。但是,它没有提供react-dnd提供的功能的广度。

    PS:以上内容来源于官方文档的翻译,如有不理解的地方可参考Github上的文档,作者还提供了专门的教程资源来帮助你使用它!enjoy it!

    收藏

    举报

    扫码下载今日头条


    分享到:


    相關文章: