Как использовать текст в заголовочном компоненте Grommet?

Question

Я использую grommet для проекта React, и мне интересно, как я могу использовать заглавные буквы в паре <Heading /> компонента.

Answer 1

Вы просите сделать заголовок capitalize и делаете Uppercase.

В своем ответе вы делаете это,

<Heading style={{'textTransform': 'uppercase'}}>{product.name}</Heading>

Предположим, ваш product.name = mobile, тогда в соответствии с вашим ответом вы получите вывод MOBILE всех uppercase букв.

Чтобы сделать это capitalize используйте это

<Heading style={{'textTransform': 'capitalize'}}>{product.name}</Heading>

Теперь вы получите желаемый результат Mobile, равный capitalized.

Подробнее о uppercase и capitalize см. this .

Answer 2

Я использовал встроенный стиль.

  <Heading style={{'textTransform': 'capitalize'}}>{product.name}</Heading>