如何在Vue.js中将驼峰大小写转换为适当的大小写？

Question

I am retrieving data from MongoDB collection & filling the data in ag-grid. I want the column header to be in proper case with Spacing. Initially, the collection has text line 'businessAreaName' and I want it to look like 'Business Area Name'.

I am using the concept of regular expression but not able to figure out expression for proper case.

headerName: x.replace(/_/g, ' ').replace(/\w\S*/g, function (txt) 
  { 
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); 
  })

The expression above is giving me output as 'Businessareaname'. Any kind of suggestion is appreciated.

Answer 1

All you really need to do is

1. replace every uppercase character with a space, followed by that character
2. replace the first character with uppercase

This can be done like so:

const deCamelCase = str => str.replace(/[A-Z]/g, ' $&').replace(/^./, toUppercase);
const toUppercase = str => str.toUpperCase();

Breaking this down:

str => str.replace(/[A-Z]/g, ' $&')

This matches any uppercase character (latin alphabet only!) and replaces it with a string consisting of a space, plus the whole matched string, coded as $& . Note that we need to use the /g flag to make sure we match every instance.

str => str.replace(/^./, toUppercase)

This matches the first character in the string only, and replaces it using the toUppercase function, which I define on a separate line for readability.