eslint-plugin-react: jsx-key `Missing "key" prop for element in array` when there is no array/iteration
Hello,
I just upgraded eslint-plugin-react from 7.28.0 to 7.29.0
The result is I now get a Missing "key" prop for element in array error on all my components, regardless of them having an array/map or anything that would require a key prop.
Before upgrade, the app worked fine, the key prop was already where it should be, on all arrays/lists.
Example of error:
17:7 error Missing "key" prop for element in array react/jsx-key

=> no array on line 17 char 7, just calling a component.
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 129
- Comments: 49 (10 by maintainers)
Commits related to this issue
- fix eslint-plugin-react version to avoid jsx-key error (#34800) Fixes https://github.com/vercel/next.js/discussions/34797. Context: https://github.com/yannickcr/eslint-plugin-react was released in 7... — committed to vercel/next.js by thibautsabot 2 years ago
- test: disabled react/jsx-key — committed to ant-design/ant-design by afc163 2 years ago
- Pin eslint-plugin-react to the last non broken release https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to KKoukiou/cockpit-machines by KKoukiou 2 years ago
- Pin eslint-plugin-react to the last non broken release https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to cockpit-project/cockpit-machines by KKoukiou 2 years ago
- build: install minor updates Avoided installing eslint-plugin-react@7.29.0. A bug in this version resulted in hundreds of false positives. https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to nl-design-system/utrecht by Robbert 2 years ago
- disable react/jsx-key after eslint upgrade Refs: https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to mmomtchev/rlayers by mmomtchev 2 years ago
- build: install minor updates Avoided installing eslint-plugin-react@7.29.0. A bug in this version resulted in hundreds of false positives. https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to nl-design-system/utrecht by Robbert 2 years ago
- temporarily pin eslint-plugin-react to work around https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to Financial-Times/x-dash by apaleslimghost 2 years ago
- [Fix] `jsx-key`: prevent false "missing array key" warning Fixes #3215 — committed to ljharb/eslint-plugin-react by ljharb 2 years ago
- Update eslint-plugin-react to latest version (#34819) * Update eslint-plugin-react to latest version There is currently a bug in eslint-plugin-react https://github.com/yannickcr/eslint-plugin-reac... — committed to vercel/next.js by kolarski 2 years ago
- [Deps] Upgrade eslint-plugin-react to 7.29.2 The upgrade to 7.29.0 had [a bug](https://github.com/yannickcr/eslint-plugin-react/issues/3215) that flagged a lot of false positives. Upgrading to 7.29.2... — committed to werkshy/pickup by werkshy 2 years ago
- [Deps] Upgrade eslint-plugin-react to 7.29.2 The upgrade to 7.29.0 had [a bug](https://github.com/yannickcr/eslint-plugin-react/issues/3215) that flagged a lot of false positives. Upgrading to 7.29.2... — committed to werkshy/pickup by werkshy 2 years ago
- webui: Pin eslint-plugin-react to the last non broken release https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to M4rtinK/anaconda by KKoukiou 2 years ago
- webui: Pin eslint-plugin-react to the last non broken release https://github.com/yannickcr/eslint-plugin-react/issues/3215 — committed to rhinstaller/anaconda-webui by KKoukiou 2 years ago
v7.29.1 is released.
I can confirm I’m seeing this with
eslint-plugin-react@7.29.0downgrading to7.28.0the error goes away.I’ll get a fix out for this today; no further comments are needed 😃
I know it’s a bit late, as many of you found the solution probably but I want to add my experience,i was facing the same problem but then I used React fragment (<></>) and the error was removed.
It works like a charm! Thank you @shrijan00003 💯
We can use resolutions temporarily until it is fixed
In package.json file
Please stop commenting “quick fixes”. A proper fix will be out soon; downgrading to v7.28.0 or disabling the
react/jsx-keyrule is all you should be doing for now.I confirm same issue, I’m using vite with React TypeScript
Just installed a new project using
npx create-next-appand I’m getting the exact same errorEveryone getting this same error. It is temporarily resolved using this https://nextjs.org/docs/api-reference/next.config.js/ignoring-eslint
Just a quick heads up to anyone still experiencing this after upgrading. You may have to delete your .next folder after upgrading to 7.29.1
sorry all good, just had to close and reopen the folder.
quick fix on .eslintrc
@awmleer because github’s releases API is very inconvenient, and i often forget to make one. I’ll do so now.
I do use keys, but of course only for the outmost element. This new rule requires a key for every child element, too. I think this is an error. In the following example the rule throws an error that the div element doesn’t have a key attribute. That’s wrong.
Wondering why there is no release log about 7.29.0 on the releases page. 🤔
The problem was fixed with the last update in my case, @7.29.2
Vite with React TypeScript
@altuno screenshots don’t make it clear what code’s being warned by what rule, but if you could file a new issue with text snippets, that’d be great 😃
I also encountered the same problem, it can be solved by downgrading the version
Same here.