[object Object] react value

[xuoutput]

[object Object] react value

[cwtuan]

1. Use react-intl-universal-extract to extract default message to your locale files.

intl.get('welcome.message', { name }).d(<span>hello, <span style="color:blue">{name}</span></span>)

2. Binding event: https://github.com/alibaba/react-intl-universal#2-how-to-bind-event-handlers-to-an-internationalized-message

[xuoutput]

我试一下, 遇到问题,

• #229

另外绑定 事件 https://github.com/alibaba/react-intl-universal#2-how-to-bind-event-handlers-to-an-internationalized-message

import {Button} from 'antd';
export default function Hello() {

const name = <Button onClick={() => console.log('111')}>world</Button>;
return <div>
{intl.getHTML('welcome.message', { name })}
</div>
}

看着依旧不能在 name 中设置, (对 Button 设置事件), 而是整个div 监听事件了.

补充下之前的 demo

比如有这么一句话和翻译
不能作为一个个 单词拆开翻译, 而是作为一整句话翻译

• 名字这里是一个自定义 React 组件, 而不是简单的 HTML 标签
• 名字这里有监听事件

hello, Tom
Tom 你好

代码

import {Button} from 'antd';
export default function Hello() {

const name = <Button onClick={() => console.log('111')}>Tom</Button>;
return <div>
{intl.getHTML('welcome.message', { name })}
</div>
}

json

// 英文
{
  "welcome.message": "hello, {name}",
}

//中文
{
  "welcome.message": "{name} 你好"
}