This repository has been archived by the owner on Jan 16, 2023. It is now read-only.
Add makeKeyProp API to allow users to generate their own React key props #255
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The problem:
The way we currently generate React key props is either by using the node's id or generating a random string
key={child.id || randomString()}
. This isn't ideal because:id
key/value. They could be using any number of arbitrary key names such askey
,sha
, etc for their unique key name.randomString()
for a key prop isn't any better than using index as the key prop(arguably worse), which is an anti-pattern. This is because the keys aren't consistent for every render, causing React to re-render all the children it is mapping over.The solution:
I added a
makeKeyProp
escape hatch for this case. This will allow users to write a function that returns a key based on the data of the respective node. This change is backwards compatible as there is a fallback as a defaultProp to use the current method.Notes:
__tests__/Container.test.js