{"record":{"id":"56b1c5d8d185d49b","repo":"dotnet/aspnetcore","slug":"more-than-one-sibling-of-component-frame-compone","errorCode":null,"errorMessage":"More than one sibling of component '{frame.ComponentTypeField}' has the same key value, '{key}'. Key values must be unique.","messagePattern":"More than one sibling of component '(.+?)' has the same key value, '(.+?)'\\. Key values must be unique\\.","errorType":"exception","errorClass":"InvalidOperationException","httpStatus":null,"severity":"error","filePath":"src/Components/Components/src/RenderTree/RenderTreeDiffBuilder.cs","lineNumber":380,"sourceCode":"                        ThrowExceptionForDuplicateKey(key, frame);\n                    }\n\n                    result[key] = new KeyedItemInfo(existingEntry.OldIndex, newStartIndex);\n                }\n            }\n\n            newStartIndex = NextSiblingIndex(frame, newStartIndex);\n        }\n\n        return result;\n    }\n\n    private static void ThrowExceptionForDuplicateKey(object key, in RenderTreeFrame frame)\n    {\n        switch (frame.FrameTypeField)\n        {\n            case RenderTreeFrameType.Component:\n                throw new InvalidOperationException($\"More than one sibling of component '{frame.ComponentTypeField}' has the same key value, '{key}'. Key values must be unique.\");\n\n            case RenderTreeFrameType.Element:\n                throw new InvalidOperationException($\"More than one sibling of element '{frame.ElementNameField}' has the same key value, '{key}'. Key values must be unique.\");\n\n            default:\n                throw new InvalidOperationException($\"More than one sibling has the same key value, '{key}'. Key values must be unique.\");\n        }\n    }\n\n    private static object KeyValue(ref RenderTreeFrame frame)\n    {\n        switch (frame.FrameTypeField)\n        {\n            case RenderTreeFrameType.Element:\n                return frame.ElementKeyField;\n            case RenderTreeFrameType.Component:\n                return frame.ComponentKeyField;\n            default:","sourceCodeStart":362,"sourceCodeEnd":398,"githubUrl":"https://github.com/dotnet/aspnetcore/blob/294cab2f9b2e03af6b953820c7ab497c3c8b7ad9/src/Components/Components/src/RenderTree/RenderTreeDiffBuilder.cs#L362-L398","documentation":"Blazor uses @key to track component instances across re-renders for efficient diffing and state preservation. During the diff phase, RenderTreeDiffBuilder builds a key-to-index map of sibling component frames. If two sibling components share the same non-null key, it throws InvalidOperationException because the diffing algorithm cannot unambiguously match old and new frames. Keys must be unique among siblings.","triggerScenarios":"Rendering a list of components where @key is bound to a non-unique value. For example: foreach (var item in Items) { <MyComponent key=\"item.CategoryId\" /> } where CategoryId repeats across items. Also triggered when @key is set to a constant or a duplicated value within the same sibling scope.","commonSituations":"Keying a list by a non-unique property (category, type, status) instead of a unique ID; data containing duplicate IDs from a backend bug; keying on an index that resets; copying and pasting component markup with hardcoded keys.","solutions":["Ensure @key is bound to a property that is unique among all siblings in the same list (typically a primary key / unique identifier).","If no natural unique key exists, combine multiple fields to form a composite unique key (e.g., key=\"item.Type-item.Id\").","Fix the source data if duplicate IDs are present.","Remove @key entirely if you don't need stable identity, rather than using duplicate keys."],"exampleFix":"<!-- before -->\n@foreach (var item in items)\n{\n    <MyComponent key=\"item.Category\" /> <!-- Category repeats -->\n}\n\n<!-- after -->\n@foreach (var item in items)\n{\n    <MyComponent key=\"item.Id\" /> <!-- Id is unique -->\n}","handlingStrategy":"validation","validationCode":"// Validate key uniqueness before rendering\nstatic void AssertUniqueKeys<T>(IEnumerable<T> items, Func<T, object> keySelector)\n{\n    var seen = new HashSet<object>();\n    foreach (var item in items)\n    {\n        var key = keySelector(item);\n        if (key != null && !seen.Add(key))\n            throw new InvalidOperationException($\"Duplicate key: {key}\");\n    }\n}\n// Use: AssertUniqueKeys(items, i => i.Id);","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Always bind @key to a unique identifier (primary key, GUID).","Add a unit test that asserts key uniqueness over the data source before rendering.","Use composite keys (string interpolation of multiple fields) when no single unique field exists.","Review foreach loops for correct @key binding during code reviews."],"tags":["blazor","key","diffing","component","razor","uniqueness"],"analyzedSha":"294cab2f9b2e03af6b953820c7ab497c3c8b7ad9","analyzedAt":"2026-08-06T20:08:02.189Z","schemaVersion":2},"datasetVersion":"2026-08-06T23:17:07.152Z"}