react-i18n links inside array of strings

Question

I have a react application with multiple translations. There I have an array of strings which look something like this:

someKey: [
    "Here is some Text",
    "Here is another Text with a link: example.com",
    "Here is more Text with links: example.com, another-example.com",
]

I get the strings with this and loop through them and put each string in a JSX Tag:

t("someKey", {returnObjects: true})

But I also want the links to be rendered like a link, so I tried this:

someKey:[
    "Here is some Text",
    "Here is another Text with a link: <a href='https://example.com'>example.com</a>",
    "Here is more Text with links: <a href='https://example.com'>example.com</a>, <a href='https://another-example.com'>another-example.com</a>",
]

Now, the HTML is rendered with the <a> tag as text and not a link (like escaped characters). How can I fix this to render it without escaping the HTML?

I have checked and tried these links:

Edit:
The problem with the linked Stack Overflow answers are, that these solutions can't be mixed with the array variant. I think if I had a string instead of a string[], it could work as expected.

react-i18n links inside array of strings

0 Answers0