reactjs 使用lodash同时使用多个JavaScript方法

gcuhipw9  于 2023-01-25  发布在  React
关注(0)|答案(2)|浏览(139)

我的数据都是大写的。我想把每个单词的第一个字母大写,其余的字母小写,但我似乎做不到。
我用lodash试过了

{
    Header: 'Security Name',
    accessor: 'securityName',
    minWidth: 70, // minWidth is only used as a limit for resizing
    width: 260, // width is used for both the flex-basis and flex-grow
    maxWidth: 300,
    Cell: e => <div>{_.lowerCase.firstUpper(e.value)} </div>,
  },

但这行不通。有什么办法吗?

rdlzhqv9

rdlzhqv91#

const capitalize = (e) => {
  const lower = e.value.toLowerCase();
  return lower.replace(/(^|\s)[a-z]/g, (match) => match.toUpperCase());
}

{
    Header: 'Security Name',
    accessor: 'securityName',
    minWidth: 70, // minWidth is only used as a limit for resizing
    width: 260, // width is used for both the flex-basis and flex-grow
    maxWidth: 300,
    Cell: e => <div>{capitalize(e)} </div>,
  },

replace()方法有两个参数:正则表达式(regex)匹配每个单词的首字母,函数返回匹配字母的大写版本。regex /(^|\s)[a-z]/g匹配每个单词的第一个字母,无论它出现在字符串的开头(^)还是空白字符(\s)之后。正则表达式末尾的g标志使匹配成为全局匹配,以便替换所有出现的模式。

pwuypxnk

pwuypxnk2#

代码不起作用的原因是因为方法不是firstUpper,而是upperFirst。此外,您需要编写_.lowerCase(_.upperFirst(e.value))而不是_.lowerCase.upperFirst(e.value),因为JavaScript方法需要括号来启动。
但是,更好的解决方案将是直接使用capitalized,这也是由lodash提供的。

// Example

_.capitalize('FRED');
// => 'Fred'

相关问题