Question

我想使用拖放库来重新排序我在数据库中拥有的组件列表，我的数组同时包含项目值和可以轻松更改为数字的唯一ID。

该库提供了一个示例，该示例使用以下代码来处理列表数据

   const [cards, setCards] = useState([
      {
        id: 1,
        text: 'Write a cool JS library',
      },
      {
        id: 2,
        text: 'Make it generic enough',
      },
      {
        id: 3,
        text: 'Write README',
      },
    ])

  const moveCard = useCallback(
      (dragIndex, hoverIndex) => {
        const dragCard = cards[dragIndex]
        setCards(
          update(cards, {
            $splice: [
              [dragIndex, 1],
              [hoverIndex, 0, dragCard],
            ],
          }),
        )
      },
      [cards],
    )

我对钩子不熟悉，我不确定如何将这些静态数据替换到已经保存的远程列表中，我可以通过props将数组传递给此示例组件。

该库是react-dnd。 ID应该是正确的还是唯一的？

Answer 1

只需设置您的数组，而不是useState中指定的数组即可。

const [cards, setCards] = useState(yourArray)

应该可以。

对于您的特定示例，我在example.jsx中添加了道具，并通过index.js进行了传递 https://codesandbox.io/s/mystifying-ganguly-mg2m9

如何用对象替换React useState？

1 个答案: