Summary
On the State: A Component's Memory page, the Sculpture Gallery example allows users to navigate through sculptures using the Next button. The gallery works correctly while navigating through valid entries, but when the user clicks Next on the final sculpture (12 of 12), the application does not cycle back to the first sculpture.
Instead, the index exceeds the sculpture list bounds, making sculpture undefined and causing the runtime error:
App.js: can't access property "name", sculpture is undefined
Expected: The gallery should wrap around from the last sculpture to the first sculpture when Next is clicked.
Actual: The application throws a runtime error because it attempts to access properties such as sculpture.name on an undefined object.
Affected screen: React.dev → Learn React → Adding Interactivity → State: A Component's Memory → Sculpture Gallery example.
Page
https://react.dev/learn/state-a-components-memory
Details
No response
Summary
On the State: A Component's Memory page, the Sculpture Gallery example allows users to navigate through sculptures using the Next button. The gallery works correctly while navigating through valid entries, but when the user clicks Next on the final sculpture (12 of 12), the application does not cycle back to the first sculpture.
Instead, the index exceeds the
sculpturelist bounds, making sculpture undefined and causing the runtime error:App.js: can't access property "name", sculpture is undefinedExpected: The gallery should wrap around from the last sculpture to the first sculpture when Next is clicked.
Actual: The application throws a runtime error because it attempts to access properties such as sculpture.name on an undefined object.
Affected screen: React.dev → Learn React → Adding Interactivity → State: A Component's Memory → Sculpture Gallery example.
Page
https://react.dev/learn/state-a-components-memory
Details
No response