javascript - 列表项的删除按钮和删除线功能（ReactJS）

Question

这是我的代码中的一个错误（CodeSandbox 链接）。当单击列表项名称时，我可以添加删除线，但是当列表中有多个项目且某些项目带有删除线并且我删除任何项目时，应用程序的行为不符合我的要求。如何修复这个错误？

提前致谢！！！！！

标签： javascriptreactjs

Answer 1

我看到问题是您uuid.v4()在渲染中使用。所以每次重新渲染，ListItem新旧状态isStrike都会丢失。

您可以确保密钥是唯一的，并且在重新渲染时不会更改。

这是您可以尝试的解决方案：https ://codesandbox.io/s/spring-rgb-w45b3?file=/src/App.js