react-i18next icon indicating copy to clipboard operation
react-i18next copied to clipboard

[react@19] Using `<Trans />` with the `components` prop gives an error 'Each child in a list should have a unique "key" prop.'

Open aiktb opened this issue 1 year ago • 1 comments

🐛 Bug Report

When using react@19, the Trans component throws an error. It has been confirmed that react@18 does not have this issue, and this error does not affect the normal operation of i18next.

This issue has a low priority because react@19 has not been officially released yet. image

To Reproduce

https://stackblitz.com/edit/vitejs-vite-ufa4wi?file=src%2FApp.tsx,package.json

npm install react@rc react-dom@rc

The sample code is from the react-i18next document:

    <Trans
      i18nKey="myKey" // optional -> fallbacks to defaults if not provided
      defaults="hello <italic>beautiful</italic> <bold>{{what}}</bold>" // optional defaultValue
      values={{ what: 'world' }}
      components={{ italic: <i />, bold: <strong /> }}
    />

This error has been known to be eliminated using <i key="1"/>.

Expected behavior

No error.

Your Environment

    "i18next": "^23.16.1",
    "react-i18next": "^15.0.3",
    "react": "^19.0.0-rc-65a56d0e-20241020",
    "react-dom": "^19.0.0-rc-65a56d0e-20241020",

aiktb avatar Oct 20 '24 12:10 aiktb