使用react-easy-sort拖拽元素时触发.map错误，求技术解决方案

错误根源 #

你的代码中useState初始化的items是数组类型，但在onSortEnd函数更新状态时，错误地返回了一个包含items属性的对象：

setItems(({items}) => ({
  items: arrayMove(items, oldIndex, newIndex),
}));

这会导致items状态从数组变成{items: [...]}的对象，后续调用items.map()时，因为对象没有map方法，直接抛出错误。

修复方案 #

修改onSortEnd函数，直接返回排序后的数组即可：

import { arrayMove } from 'react-easy-sort'; // 确保正确导入arrayMove

const [items, setItems] = useState(['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I'])

const onSortEnd = ({oldIndex, newIndex}) => {
  setItems(prevItems => arrayMove(prevItems, oldIndex, newIndex));
};

额外检查点 #

• 确认arrayMove是从react-easy-sort库中正确导入的，避免使用第三方不兼容的arrayMove方法
• 确保SortableList和SortableItem组件都正确从react-easy-sort导入：

import { SortableList, SortableItem } from 'react-easy-sort';

内容的提问来源于stack exchange，提问作者Bas Mienis