Question

我有2个数组：

function App() {
  const [historyText, setHistoryText] = useState([]);
  const [reversedHistoryText, setReversedHistoryText] = useState([]);

historyText工作正常，但我想撤消它。所以我想我先将数组复制到临时数组：我尝试过：

setReversedHistoryText([...reversedHistoryText, historyText]);

和

setReversedHistoryText(historyText);

但是，实际上都没有将数组复制到新数组的方法。我在做什么错了？

**更新现在，我可以将其添加到另一个数组中，但是每次都缺少最后一个条目。

    setHistoryText([...historyText, tempComp]);
    setReversedHistoryText(historyText.slice().reverse());

Answer 1

您很亲近，但也忘了扭转它。

由于状态更新是异步的，因此在调用状态更新程序后无法立即获取最新状态。

如果这是historyText和setReversedHistoryText唯一更新的地方，则只需将新项目追加并添加到数组中

setHistoryText([...historyText, tempComp])
setReversedHistoryText([tempComp, ...reversedHistoryText])

如果仅需要在此函数中更新setReversedHistoryText，则可以创建下一个historyText数组，然后使用该值更新反向数组

const nextHistory = [...historyText, tempComp]
setHistoryText(nextHistory)

// then
setReversedHistoryText([...nextHistory].reverse())

// other variations
setReversedHistoryText(nextHistory.slice().reverse())

setReversedHistoryText(Array.from(nextHistory).reverse())

Answer 2

如果要复制historyText数组，请使用：

setReversedHistoryText(historyText.slice());

或

setReversedHistoryText(...historyText);

在对钩子做出反应时，如何复制和排列然后反转它？

2 个答案: