创建一个使用React Native的``标题大小写''的函数

Question

I'm trying to get some input from user to automatically become Title Cased. The code looks solid to me but it seems to not be giving me the output I really want. It is not hooking up the first letter as a uppercase. This is the code to make input title case.

export function titleCase(str: string): string {
    return !str
        ? ""
        : str.toLowerCase()
            .split(" ")
            .map(function(word: string): string {
                return word && word.length > 0 ? word.replace(word[0], word[0].toUpperCase()) : ""
            })
            .join(" ")
}

and then I call it in a view tag like so...

<Text style={styles.providerNameTxt}>
    {Scenes.Detail.titleCase(providerName)}
</Text>
<Text style={styles.providerSpecialtyTxt}>
    {Scenes.Detail.titleCase(providerSpecialty)}
</Text>

Shouldn't this work? When the user goes to input (providerName) the input does not automatically upper case the first letter. I'm not sure why. The file is called detail.ts and it sits under the util/scenes folder. So using "Scenes.detail" should call the function. Unless my function is wrong. Also, in scenes/detail.ts there is an export default for titleCase. It wasn't there earlier and so I added it but it still is not working as I would like.

Answer 1

在任何用空格分隔单词的字符串str上尝试str.replace(/\\b(\\w)/g, k => k.toUpperCase()) 。

Answer 2

export const toTitleCase = (str) => {
 return str.replace(
     /\w\S*/g,
     (txt) => {
         return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
     }
 );
}