Skip to content

Warning: Each child in a list should have a unique "key" prop #36025

@eirichmond

Description

@eirichmond

When I have SCRIPT_DEBUG enabled everytime I add my custom block I get the following warning:

Warning: Each child in a list should have a unique "key" prop. See https://fb.me/react-warning-keys for more information.

this is the edit function:

export default function Edit({ attributes, setAttributes }) {
	const blockProps = useBlockProps( {
		className: 'my-random-classname-test',
	} );
	const {
		background_color
	} = attributes;

	function onChangeBgColor ( colorValue ) {
		setAttributes({background_color: colorValue})
	}

	return ([
		<InspectorControls>
			<PanelBody>
				<PanelColorSettings // Element Tag for Gutenberg standard colour selector
					title= { 'Background Colour' }
					colorSettings = {[
						{
							value: background_color,
							onChange: ( colorValue ) => onChangeBgColor(colorValue),
							label: __( 'Background Color' ),
						}
					]}
				/>
			</PanelBody>
		</InspectorControls>,
		<div { ...blockProps }>
			<div style={ { backgroundColor: background_color } }>this is another panel</div>
		</div>
	]);
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    Needs Technical FeedbackNeeds testing from a developer perspective.Needs TestingNeeds further testing to be confirmed.

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions