React Key 在非数组、队列场景下的应用

猜猜这段代码会发生什么事?

以为仅仅是切换下按钮?

其实是会执行下面的流程

  1. isEditingfalse 的时候,点击 button
  2. isEditing 变成了 true
  3. 重新 render,在 virtualDOM 进行 diff 的时候,给 button 添加了 type=submit 以及 form='form-1'
  4. #form-1 表单被意外的 submit 了

来个 DEMO 验证下 继续阅读“React Key 在非数组、队列场景下的应用”