Categories
JavaScript Answers React Native Answers

How to capitalize first letter of text in React Native?

Spread the love

Sometimes, we want to capitalize first letter of text in React Native.

In this article, we’ll look at how to capitalize first letter of text in React Native.

How to capitalize first letter of text in React Native?

To capitalize first letter of text in React Native, we can create our own function.

For instance, we write:

import * as React from 'react';
import { Text, View } from 'react-native';

const capitalize = (str) => {
  return str[0].toUpperCase() + str.slice(1);
};

export default function App() {
  return (
    <View>
      <Text>{capitalize('hello')}</Text>
    </View>
  );
}

to define the capitalize function that returns a string with the first letter of str capitalized.

We call toUpperCase to capitalize the first letter and slice with 1 to return the characters in str starting from index 1 to the end of the string.

As a result, we see ‘Hello’ displayed.

Conclusion

To capitalize first letter of text in React Native, we can create our own function.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *