在两个可拖放的平面列表-React Native之间拖放

npm install react-native-draggable-flatlist

import DraggableFlatList from 'react-native-draggable-flatlist';

const data = [
  { key: 'item1', label: 'Item 1' },
  { key: 'item2', label: 'Item 2' },
  { key: 'item3', label: 'Item 3' },
  // ...
];

const renderItem = ({ item, index, drag, isActive }) => {
  return (
    <TouchableOpacity
      style={{
        backgroundColor: isActive ? 'blue' : 'white',
        padding: 16,
        flexDirection: 'row',
        alignItems: 'center',
      }}
      onLongPress={drag}
    >
      <Text>{item.label}</Text>
    </TouchableOpacity>
  );
};

<DraggableFlatList
  data={data}
  renderItem={renderItem}
  keyExtractor={(item) => item.key}
  onDragEnd={({ data }) => {
    // 处理拖放结束后的逻辑
  }}
/>