想要实现动态插值以及插入元素，如下效果

这个找了蛮久的，官网的例子在我这无效，所以网上找了比较久，没能理解用法。最后是在 github issue 中看到别人的用法，自己理解下实现出来了，所以这里记录下。

例如vue的写法，直接使用插槽：

     <i18n-t keypath="auth.agreement" tag="p"><template #appName>{{ $t('app.name') }}</template><template #termsService><b> {{ $t('auth.termsService') }} </b></template><template #privacyPolicy><b> {{ $t('auth.privacyPolicy') }} </b></template></i18n-t>

React Native 的写法：

  <Transvalues={{name: 'ddd',count: 22,}}i18nKey="userMessagesUnread"parent={Text}components={{1: <Text style={{ color: 'red', fontWeight: 'bold' }}></Text>,5: <Text style={{ color: 'blue' }}></Text>,}}></Trans>

附上官网：https://react.i18next.com/legacy-v9/trans-component
说真的 ，这个官网看了很久没看明白这个 Trans 组件，用法完全不同，不确定是不是版本的问题。

    "react": "18.3.1","react-dom": "18.3.1","i18next": "^24.2.1","react-i18next": "^15.4.0",