npm包rn-touchable-sort-list使用教程-JavaScript中文网-JavaScript教程资源分享门户

#npm包rn-touchable-sort-list使用教程

介绍

rn-touchable-sort-list是一款基于React Native开发的组件，它可以方便地将列表中的项进行拖拽排序。

安装

使用npm来安装rn-touchable-sort-list：

npm install --save rn-touchable-sort-list

使用示例

使用rn-touchable-sort-list非常简单，只需要引入并使用即可。以下是一个简单的示例，展示如何使用它来实现一个可以拖拽排序的列表：

-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ - ----------- ----- ---- - ---- ---------------
------ ------------ ---- -------------------------

----- ---- - -
  - ----- ----- -- --
  - ----- ----- -- --
  - ----- ----- -- --
  - ----- ----- -- --
  - ----- ----- -- -
--

------ ------- ----- --- ------- --------- -
  -------- -
    ------ -
      ----- -------------------------
        -------------
          -----------
          ----------------- -- ----- ---------------------------------------
          -------------------------- -- -----------------------
          -------------------- ------ -- ---------------------
        --
      -------
    --
  -
-

----- ------ - -------------------
  ---------- -
    ----- --
    ---------------- ----------
    ----------- --
  --
  ----- -
    ------------------ ---
    ---------------- ---
    ------------ --
    ------------ ------
  -
---

SortableList中的主要props参数：

data （必填）：原始数据，需要进行拖拽排序的数据
renderRow （必填）：根据数据渲染每一个Item，类似于FlatList的renderItem函数
onChangeOrder （必填）：排序后数据的回调函数，接受重新排序的数组作为参数
keyExtractor: 根据每条数据生成唯一key
onReleaseRow: 每次释放手指后的回调函数

总结

rn-touchable-sort-list可是让我们的工作更加方便，它可以方便地将列表中的项进行拖拽排序，是React Native开发中非常实用的工具，值得我们学习使用。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/600668f4d9381d61a3540e6d