javascript - 在 React.Intl 上运行函数

Question

我正在尝试运行一个函数来对 FormattedMessage 的结果进行进一步的字符串操作。即使通过以下函数运行它，我也找不到方法：

<Button text={ this.testMethod(buttonText) } />

testMethod(result){
 return result;
}

总之：我正在尝试获取实际文本而不是对象，然后进行一些字符串操作。

不想这样：{id: "test", defaultMessage: "Hello there"}

需要：访问“Hello there”，例如提取单词“there”

标签： javascriptreactjsjsxreact-intl

Answer 1

是的你可以。添加一个组件作为子组件FormattedMessage以进行进一步的转换。这是一个最小的片段，可以帮助您入门

<FormattedMessage id="hello">
  {(text) => {
    console.log(text);
    return <>{text.toUpperCase()}</>;
  }}
</FormattedMessage>

现场示例