Skip to content

fix(View): pass fallbackKey to renderItem in default children branch - #653

Open
cricrimessina wants to merge 1 commit into
reshaped-ui:canaryfrom
cricrimessina:fix/view-item-fallback-key
Open

fix(View): pass fallbackKey to renderItem in default children branch#653
cricrimessina wants to merge 1 commit into
reshaped-ui:canaryfrom
cricrimessina:fix/view-item-fallback-key

Conversation

@cricrimessina

Copy link
Copy Markdown

Summary

Fix for React key warning. In View's renderItem, the default branch (used when a child doesn't match the Hidden or multi-child Fragment cases) never passes a fallbackKey, unlike the other two branches. So when a View/View.Item child has no explicit key, the wrapping Fragment ends up keyed with undefined — hence the "Each child in a list should have a unique key prop" warning.

Fix: pass usedIndex as fallbackKey, same as the other branches already do.

Related Issue

None — found while debugging a React key warning in a consuming app.

Screenshots / Recordings

image

No visual change, just a fix for a console warning.

Notes for Reviewers

Single line change:

return renderItem({ child, index: usedIndex, fallbackKey: usedIndex });

Example that triggers the warning before this fix — plain text and a <br /> as direct children, none with an explicit key:

<View as="p" justify="center" textAlign="center">
  {__("Some descriptive text explaining a concept to the user.")}
  <br />
  {__("A second sentence continuing the explanation, on its own line.")}
</View>

@blvdmitry

Copy link
Copy Markdown
Contributor

@cricrimessina Hey, thanks for the PR, is this happening for you in React 18 or 19? I tried running fable against the PR trying to better understand the edge cases and it suggested that it shouldn't be happening in React 19 today already

@cricrimessina

cricrimessina commented Aug 13, 2026 via email

Copy link
Copy Markdown
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants