

Post 1: "Using the Fragment component, we can now accomplish the same without the array syntax and without using keys." (emphasis mine)


I'm also clearly not the only person confused here:
#KEY ON REACT FRAGMENT CODE#
Is that new since 16.2.0? (That's the version that we're on.) I just revisited my code and was able to reproduce the behavior where I get a key warning with an array and no key warning with a thanks also for the jsfiddle – I think that is exactly my problem. Thanks for the jsfiddle I'm shocked to see a Fragment giving key warnings, because I've never seen that behavior before. Please let me know if I've misunderstood any of this – I figure that's more likely than not 😅 The dual behaviors make a lot of sense to me (if React can't figure out on its own whether siblings need keys, it's great for us to have a way to explicitly tell it when they do or don't) but it seems to me that such an important and subtle nuance would call for a lot of documentation and instead has none that I can find. Instead, I don't believe it's mentioned at all. But if we're relying on that expectation to avoid a major gotcha, I would assume it would be explicitly mentioned in the docs for fragments, and prominently featured in a warning-style yellow box. Right now, I believe you can make a dynamic list of elements, throw it in a fragment, and get no key warning message – but have bad performance and non-stable updates.Īs best as I can tell, the reason for the difference in behavior is that fragments are expected to be understood as having a different semantic meaning than arrays, to be used for static content only. But I learned today that that is not the case. Until today I assumed that meant "ah, React 16.2 introduced some clever new tech that obviated the need for keys". (Apologies if this has been discussed before, I searched and didn't find anything.)Ĭurrently if you create an array of elements without keys you get a key warning message, and if you create a fragment of elements without keys you do not.
