Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React keys must be passed directly to JSX without using spread #6995

Closed
melloware opened this issue Aug 6, 2024 · 0 comments · Fixed by #7000 · May be fixed by leoo1992/GeradorQRCode#95
Closed

React keys must be passed directly to JSX without using spread #6995

melloware opened this issue Aug 6, 2024 · 0 comments · Fixed by #7000 · May be fixed by leoo1992/GeradorQRCode#95
Labels
Type: Bug Issue contains a defect related to a specific component.

Comments

@melloware
Copy link
Member

Describe the bug

Running locally you see tons of these warnings.

Warning: A props object containing a "key" prop is being spread into JSX:
  let props = {key: someKey, className: ..., data-p-focused: ..., tabIndex: ..., onClick: ..., onKeyDown: ..., onFocus: ..., onBlur: ..., data-pc-section: ..., children: ...};
  <div {...props} />
React keys must be passed directly to JSX without using spread:
  let props = {className: ..., data-p-focused: ..., tabIndex: ..., onClick: ..., onKeyDown: ..., onFocus: ..., onBlur: ..., data-pc-section: ..., children: ...};
  <div key={someKey} {...props} />

Apparently key must be declared on the element and not in a spread.

Reproducer

Showcase

System Information

primereact 10.8.2

Steps to reproduce the behavior

Run npm run dev on showcase and go to DataView example

Expected behavior

No response

@melloware melloware added Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible Type: Bug Issue contains a defect related to a specific component. and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Aug 6, 2024
@melloware melloware self-assigned this Aug 6, 2024
@melloware melloware added this to the 10.8.3 milestone Aug 6, 2024
@github-actions github-actions bot added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Aug 6, 2024
@melloware melloware removed their assignment Aug 6, 2024
@melloware melloware removed this from the 10.8.3 milestone Aug 6, 2024
@melloware melloware removed the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Aug 6, 2024
melloware added a commit to melloware/primereact that referenced this issue Aug 6, 2024
melloware added a commit to melloware/primereact that referenced this issue Aug 6, 2024
melloware added a commit to melloware/primereact that referenced this issue Aug 6, 2024
melloware added a commit to melloware/primereact that referenced this issue Aug 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a defect related to a specific component.
Projects
None yet
1 participant