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

[Bug]: checkKeyMustBeforeSpread of react/jsx-key doesn't work when generating array dynamically #3742

Closed
2 tasks done
gvrnmntdept opened this issue Apr 26, 2024 · 0 comments · Fixed by #3769
Closed
2 tasks done

Comments

@gvrnmntdept
Copy link

Is there an existing issue for this?

  • I have searched the existing issues and my issue is unique
  • My issue appears in the command-line and not only in the text editor

Description Overview

Even though checkKeyMustBeforeSpread works correctly when we use it on statically defined elements, the error is missed for dynamically generated items.

// No Error, Incorrect behavior 
<div>
    {data.map(x => <div {...spread} key={x.id}/>)}
</div>

// Error detected, Expected behavior
<div>
    <div {...spread} key={1}  />
    <div {...spread} key={2}  />
    <div {...spread} key={3}  />
</div>

Expected Behavior

react/jsx-key should report an error when the checkKeyMustBeforeSpread option is enabled and the array of elements is generated dynamically.

eslint-plugin-react version

v7.33.2

eslint version

v8.54.0

node version

v20.10.0

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