可以手动更改ReactJS组件的密钥吗？

Question

我在项目中使用uncontrolled form input components，有时我需要清除一个输入/一组输入的值。我发现一种简单的方法是手动更新组件的key属性。

它有效，但这是不好的做法吗？手动更改密钥时，我是否应该关注性能/内存问题？

Answer 1

当使用虚拟DOM进行区分时，React使用键来查找“相同”元素。更改键是有效的，因为它欺骗React将您的输入视为新元素。在很大程度上，这将影响您的表现，因为React将创建＆amp;销毁DOM元素，而不是仅更改已更改的属性。在小范围内，您可能不会看到任何明显的性能命中。

如果你正在清除价值，我觉得你可能并没有真正掌握不受控制的输入。毕竟，你在某种程度上“控制”它。但是，如果这是您触摸输入值的唯一原因，我可以看到为什么让它“不受控制”会有吸引力。我没有测试过这个，但我认为你应该能够通过给元素一个ref并以这种方式访问​​DOM元素来以编程方式将值设置为空字符串...我的假设是因为它是不受控制的，所以React不会在变异/渲染时要注意值属性。