title: Dynamic content inside Trans Component i18next
body: <p>I have a list of translated keys and react component content.
  e.g :</p>
  
  <pre><code>    list = [{ translation: "Hello &lt;1&gt;World&lt;/1&gt;", content: "Hello &lt;a href='#'&gt;World&lt;/a&gt;" },
  { translation: "A &lt;1&gt;B&lt;/1&gt;", content: "A &lt;a href='#'&gt;B&lt;/a&gt;" }]
  </code></pre>
  
  <p>The idea is to show a translated data from the list using the "translation" and the structure of "content" with Trans Component of i18next-react with a map function.</p>
  
  <pre><code>{list.map((item) =&gt; (
  &lt;Trans i18nKey={item.translation}&gt;
      {item.content}
  &lt;/Trans&gt;))}
  </code></pre>
  
  <p>Unfortunately, this doesn't seem to work at all, the outcome is only the translated string, without the structure that should came by the React Component content.</p>
  
  <p>Any idea how to work around this?</p>