Convert Uppercase to lowercase rather than in starting of a word in Reactjs

Question

I have a string of full capitalized. I only want the first letter of a word in uppercase other in lower case. for eg: ALREADY BILLED TO COMPANY PLAN. I want it as 'Already Billed To Company Plan'. How to convert it in Reactjs? But actually the string is in an array which more string. I want to convert each string in that array.

Answer 1

You can use css for it using this

.your-class {
   text-transform: capitalize;
}

or if you want pure ReactJS styling you can use this

<div style={{ textTransform: 'capitalize' }}> Your text </div>

Working sample

.capitalize {
  text-transform: capitalize;
}

<div class="capitalize"> this text should be capitalized using css </div>

Answer 2

Well aside from splitting the string by spaces and then finding the first character of each substring and using .toUpperCase to ensure it is uppercase and then converting the rest of the string using .toLowerCase, you could consider putting the text in a class and apply text-transform: uppercase; to the CSS class.

Answer 3

You can do this in CSS, just wrap your element in span and add a class of text-transform: capatilize

for eg

<span className='capatilize'>
{
your content
}
</span>

But if you want to use in js only then this question and its answer may help you

Basically use create one function and in that function, with the help of regular expression, you can convert into capitalizing.