如何在React Native中大写Moment组件

Question

我有以下组件：

<Moment element={Text}
format="MMM DD, YYYY at h:mma"
style={dateStyle}
>
{this.props.updateDate}
</Moment>

它当前正在输出类似Jan 01, 2017 at 12:53pm的东西，但我需要它来输出JAN 01, 2017 AT 12:53PM。

通常情况下，您会使用{string.toUppercase()}来实现这一点，但我在弄清楚如何获得输出时遇到了问题。

如有任何帮助，我们将不胜感激。谢谢

Answer 1

在2017年我最初做出回应时，我认为可以简单地使用CSStext-transform: uppercase是错误的。React Native不使用传统的CSS，而是使用JavaScript添加样式。

当时，React Native并不支持这一点。我本该删掉答案的。

但是，从那时起，Text组件style属性现在支持：

textTransform: 'uppercase'

https://facebook.github.io/react-native/docs/text#style

Answer 2

创建自己的UpperText组件，并将其作为element传递给Moment。在UpperText组件中，将toUppercase()应用于其字符串子级，并返回带有大写文本的Text。