question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Support Trans component with react-i18next

See original GitHub issue

Is your feature related to a specific framework or general for this extension react-i18next

Is your feature request related to a problem? Please describe. No

Describe the solution you’d like Supports <Trans> components in some way.

Additional context react-i18next has the Trans react component (https://react.i18next.com/latest/trans-component) to help on translating content with children react nodes, example:

<Trans t={t} i18nKey="hello">Hello<strong>{{name}}</strong></Trans>

Would have the following format:

  "hello": "Hello <1>{{name}}</1>"

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:7 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
antfucommented, May 5, 2020

Actually it’s supported but you have to lie the i18nKey right after the Trans currently:

<Trans i18nKey="hello" t={t}>Hello<strong>{{name}}</strong></Trans>

I will make it more relax in the next release. Thanks

0reactions
blanchardjeremycommented, Nov 4, 2020

@antfu added: https://github.com/antfu/i18n-ally/issues/423

Thanks so much for all your work!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Trans Component - react-i18next documentation
This component enables you to nest any React content to be translated as one cohesive string. It supports both plural and interpolation.
Read more >
React-i18n Trans Component with translations that contain ...
In my React component, I want the string to be rendered like this. Welcome to our site, John. Using the useTranslation function normally...
Read more >
Use i18next Trans Component to Translate Complex React ...
The react-i18next library has a Trans component that we can use to interpolate or translate complex react element. In most cases, we don't...
Read more >
React-i18next trans component explained - Oscar Franco
Recently I had to use the react-i18next trans component, here is the first line of the documentation: While the Trans component gives you...
Read more >
A Guide to React Localization with i18next | Phrase
React -i18next is a powerful set of components, hooks, and plugins that sit on top of i18next. Learn how to use it to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found